echarts 圖示直接設定寬度 100% 會預設魏100px,需要自適應方法如下
圖示html
<el-col :span="8"> <div id="userNianling_three" style="width: 100%; height: 500px;" /> </el-col>
date裡面定義圖表
data() { return { myChart: null, } },
mounted裡面
mounted() { // 寬度變化動態變化寬度 this.__resizeHandler = debounce(() => { if(this.myChart) { this.myChart.resize() } }, 100) window.addEventListener('resize', this.__resizeHandler) // 寬度給個初始化-某則只能變化寬度才能變化 this.__resizeHandler() },
然後頁面銷燬要去除監聽
beforeDestroy() { window.removeEventListener('resize', this.__resizeHandler); },
圖示的資料賦值就正常賦值就好了