实现echarts图表自适应

Posted trueYann

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了实现echarts图表自适应相关的知识，希望对你有一定的参考价值。

需求是实现echarts图表的自适应，实现起来逻辑并不复杂
    //在methods下添加方法
     screenAdapter_myChart() {
      const adapterOption = {}
      this.myChart.setOption(
        adapterOption
      )
      this.myChart.resize()
    },
    
    //在mounted下添加监听，屏幕分辨率变化时触发事件
    this.screenAdapter_myChart()
    window.addEventListener(
      \'resize\',
      this.screenAdapter_myChart
    )
    
    //在destroyed下销毁监听器
    window.removeEventListener(
      \'resize\',
      this.screenAdapter_myChart
    )

完成

以上是关于实现echarts图表自适应的主要内容，如果未能解决你的问题，请参考以下文章