echarts本身有一个resize()函数,只需要在窗口改变的时候,也就是window对象触发onresize事件,调用它,使之重新渲染页面就可以了
mounted() {
// 根据窗口大小调整曲线大小
window.onresize = () => {
// 基于准备好的dom,初始化echarts实例
let myChart = this.$echarts.init(document.getElementById('myChart'));
myChart.resize();
};
},
在vue项目中使用Echarts 一般window.onsize在页面中只能存在一个。 如何在一个页面中多个echarts使用window.onresize?
// myChart 可以放在Data数据里面
myChart = this.$echarts.init(document.getElementById('myChart'))
window.addEventListener("resize", () => { myChart.resize(); });
推荐阅读:点击查看