先貼上我的代碼:
<el-row> <el-col :span='24'> <el-card> <div slot="header">某周網站訪客來源分析</div> <div ref="A" :options="optionsA" style="width: 100%; height: 400px"></div> </el-card> </el-col> </el-row>
mounted () { this.drawEchar(); }, methods: { drawEchar () { const chartA = this.$echarts.init(this.$refs['A']); chartA.showLoading(); reqGetEchartsBar().then(data => { if (data.code === 200) { const options = data.data; // chartA.setOption(this.optionsA) chartA.setOption({ type: 'bar', series: options.bar.optionsA.series }); setTimeout(() => { chartA.hideLoading(); }, 1000) } else { chartA.hideLoading(); } }).catch(err => { chartA.hideLoading(); console.log(err); }) }
報錯原因:
自己並未加載默認數據:
第一個setOption 只是為了顯示靜態數據。
第二個setOption 只是為了顯示動態數據。
配置如下圖: