示例代码为左上方的CPK分析直方图组件  

<template>
  <div ref="cpk" id="cpk" style="height: 300px; width: 100%"></div>
</template>

<script>
import * as echarts from "echarts";
import { debounce } from "../../../../utils";
export default {
  name: "CpkVue",
  components: {},
  data() {
    return {
      myChart: null,
    };
  },
  created() {
    this.initEchart();
  },
  mounted() {
    const cpkEchart = document.getElementById("cpk");
    this.myChart = echarts.init(cpkEchart);
    this.__resizeHandler = debounce(() => {
      // this.myChart 所绘制的图表
      if (this.myChart) {
        this.myChart.resize();
      }
    }, 100);
    this.$nextTick(() => {
      window.addEventListener("resize", this.__resizeHandler);
    },