1.只监听页面Windows窗口发生变化时
initEchart () {
let chartDom = document.getElementById('main')
let myChart = echarts.init(chartDom)
this.resizeDraw = myChart
this.option && myChart.setOption(this.option)
// 可以在Windows宽度发生变化时进行图标更新
window.addEventListener('resize', () => {
if (myChart) {
myChart.resize()
}
})
}
2.当页面中放置echarts图表的容器宽度会发生变化时
在容器宽度发生变化时再调用一次图标初始化的方法
initEchart () {
let chartDom = document.getElementById('main2')
let myChart = echarts.init(chartDom)
this.resizeDraw = myChart
this.option && myChart.setOption(this.option)
window.addEventListener('resize', () => {
if (myChart) {
myChart.resize()
}
})
// 需要添加延时,否则会使resize不会生效
setTimeout(() => {
myChart.resize()
}, 500)
}