我也是踩坑了，經過半天的掙扎和尋找資料最終得出來的結果！
經過仔細檢查可以看出，直接聲明的div里會被echarts自動掛載一個_echarts_instance_屬性，導致echarts掛載頁面渲染的時候存在一個緩存問題，參考下圖：

解決方案：把她清空之后，后面就能正常掛載到頁面上進行渲染了，參考下圖：

// 主要代碼：document.getElementById("instrument").setAttribute('_echarts_instance_', '')// 我所寫的項目是vue3,但是用的是以前拷貝的vue2代碼，所以需要用到markRaw函數(shù)， // 如果使用vue3編寫就無需加markRawthis.loadChart = markRaw(echarts.init(document.getElementById("instrument")));// 繪制圖表this.loadChart.setOption(this.option,true); 都到這里了，那問題就解決了，如果還有頁面數(shù)據(jù)沒有解決的話就使用下面兩個echarts官方API來清空數(shù)據(jù)和清空畫布，如果有幫助的話給個鼓勵點個贊吧~~~~ //清空畫布this.loadChart.clear();//清空數(shù)據(jù)this.loadChart.dispose();

總結

以上是生活随笔為你收集整理的vue使用echarts图表渲染异常本地正常，线上时有时无的渲染的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。