親測有效，echarts刷新圖表，清空圖表數據

最近在用echarts進行前臺圖表展現，發現每次加載若是數據不變，則圖表不變化，所以進行了一些嘗試。

首先，簡要說一下我理解的echarts：

一、引入echarts的js文件；

二、經過var mychartDiv=document.getElementById("id")獲取div對象,而後在此div中填圖表數據，理解這個就很清楚的知道怎麼在一個頁面中放入多個圖表了；

三、獲取div對象後能夠經過var myEchart=echarts.init(mychartDiv)初始化echarts實例；

四、經過myEchart.removeAttribute("_echarts_instance_");在每次清空後從新加載；（本節標題的重點）

五、定義echartOption； var echartOption={}，具體見官網寫得很詳細，傳送門：https://www.echartsjs.com/zh/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts

六、最後，經過前面獲得的實例經過myEchart.setOption(echartOption,true);便可顯示圖表。

看到這兒若是還出現沒有清空圖表的狀況，能夠在

經過$("#id")).empty()方法在加載echarts前對div 進行清空，

或者document.getElementById('id').innerHTML = ""，

或者$('#id').html("");

這樣就能夠完美解決問題。

=========================我是分隔符==========================

若是到如今你尚未看懂，總結2步：

一、清空圖表所在的div，js代碼是document.getElementById('bigDiv').innerHTML = ""；

二、在echarts.init(document.getElementById("id"))前增長代碼document.getElementById("id").removeAttribute("_echarts_instance_");

若是有疑問歡迎留言。

效果圖以下：

 更改前，若是數據加載失敗圖表仍在：

 

 更改後，若是加載失敗圖表也消失：

 

 下面是正常狀況下的圖表：

 

 

 

 

 

 

 

 

 

 

原文出處：https://www.cnblogs.com/jmwan/p/11989410.html