mounted() {
window.onresize = () => {
// 根据窗口大小调整曲线大小
this.myChart1.resize();
this.myChart2.resize();
this.myChart3.resize();
this.myChart4.resize();
};
},
三个echarts图表,明明宽度设置的都是100%,却只有第一个生效以及如何实现自适应
解决办法
1.初始化时需要加上,确保操作的是最新的DOM
this.$nextTick(_ => {
});
2.echarts图表自适应实现,需要在渲染图表后加上
// 监听窗口变化 - 只刷新最后一个图表
window.onresize = ()=> {
this.pieEcharts.resize();
}
// 监听窗口变化 - 多个图表同时刷新
window.addEventListener("resize", function() {
myChart.resize();
});