更改之前的效果圖:
更改之前瀏覽器視窗放大縮小圖表都不會進行動態的縮放，
更改之后的效果圖：
更改之后圖表就會根據瀏覽器視窗大小實時監聽進行縮放
代碼：
topChart.setOption({
series: [
{name: '最大值',type: 'line',stack: '最大值',data: dataMax},
{name: '最小值',type: 'line',stack: '最小值',data: dataMin},
{name: '平均值',type: 'line',stack: '平均值',data: dataAvg},
]
});
window.addEventListener("resize",()=> {//監聽瀏覽器視窗大小
topChart.resize();
});
如果有多個圖表同時渲染，給個定時器就可以了，ss[0]，ss[1]，ss[2]，ss[3]分別表示四個圖表的class
var resizeTimer = null;
window.addEventListener("resize", () => {
if (resizeTimer) {
clearTimeout(resizeTimer)
}
resizeTimer = setTimeout(function(){
ss[0].resize();
ss[1].resize();
ss[2].resize();
ss[3].resize();
}, 10);
});
沒了，結束了，是不是很簡單吶，如有問題，歡迎留言，
最后：如果此篇博文對您有幫助，還請動動小手點點關注點點贊吶~，謝謝 ~ ~
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/301989.html
標籤：其他
上一篇：基于Uni-APP多端「h5+小程式+App」高仿抖音小視頻|直播|聊天實體
下一篇：【中秋】模擬太陽系行星的公轉