echarts移动端的resize适配

function fontSize(res) {
  const clientWidth =
    window.innerWidth ||
    document.documentElement.clientWidth ||
    document.body.clientWidth;
  if (!clientWidth) return;
  let fontSize = clientWidth / 750;
  return res * fontSize;
}

var chartDom = document.getElementById("lineCharts");
var myChart = echarts.init(chartDom);
var option;
// 初始化options
function initOptions() {
  option = {
    grid: {
      top: fontSize(20),
      bottom: fontSize(40),
      right: fontSize(5),
    },
    xAxis: {
      type: "category",
      axisLabel: {
        color: "#666666",
        fontSize: fontSize(22),
      },
      axisTick: {
        show: false,
      },
      axisLine: {
        lineStyle: {
          color: "#B2B2B2",
        },
      },
      data: ["三", "四", "五", "六", "日", "一", "二"],
    },
    yAxis: {
      type: "value",
      axisLabel: {
        color: "#B2B2B2",
        fontSize: fontSize(24),
      },
      splitLine: {
        lineStyle: {
          color: "#E5E5E5",
        },
      },
    },
    series: [
      {
        data: [110, 135, 105, 156, 148, 200, 120],
        type: "line",
        showSymbol: false,
        lineStyle: {
          width: fontSize(3),
          color: "#00A2FF",
        },
        areaStyle: {
          normal: {
            color: {
              type: "linear",
              x: 0,
              y: 0,
              x2: 0,
              y2: 1,
              colorStops: [
                {
                  offset: 0,
                  color: "#00A2FF33",
                },
                {
                  offset: 1,
                  color: "#00A2FF00",
                },
              ],
            },
          },
        },
      },
    ],
  };
}
initOptions();

option && myChart.setOption(option);

window.addEventListener("resize", function () {
  initOptions();
  option && myChart.setOption(option);
  myChart.resize();
});