我在js文件中開了個定時器，每1s從后端獲取數據并解析，然后用異步方法就渲染不出來，改成同步就可以了。
這個解決方法來自于這篇文章，我出的問題和他一樣：關于ajax中readyState的值一直為1的問題
這里將ajax參數修改為false即可：

xmlhttp.open("GET","http://www.test.com/getData.php?q=",false);

但是還有個問題，更改數據后還需要更新echarts組件的配置，否則頁面不會動態刷新，還是靜態的。
根據mychart組件使用的三部曲：

實例化對象

指定配置項和數據

把配置項給實例對象
我們在第一次setOption之后開一個定時器，在內部更新數據，然后對于option的需要更新的參數重新賦值，然后再次調用setoption，這樣數據發生改變后，我們的組件也會動態刷新了。

// 3. 把配置項給實例對象myChart.setOption(option);setInterval(function() {// 讀取數據庫文件,更新配置var obj= Myupdate();if (obj != null) {option.xAxis.data = obj.mytype;option.series.data = obj.mydata;myChart.setOption(option,true);}}, 500);

這里執行號Myupdate()函數之后，obj的mytype和mydata的值都是正確的，但是在網頁端debug發現，賦值之后查看option的xAxis的data還是沒有被賦值，經過翻閱相關博客，以及再次查看網頁端代碼發現是這個問題:

封裝好的數組應該賦給：

option.xAxis[0].data = obj.mytype; option.series[0].data = obj.mydata;

因為這兩個配置都是數組…絕了

update函數內容如下：

function Myupdate() {var xmlhttp=new XMLHttpRequest();var mytype = new Array();var mydata = new Array();xmlhttp.onreadystatechange=function(){if (xmlhttp.readyState == 4 && xmlhttp.status == 200){var txt = xmlhttp.responseText;// 解析for (var i = 0; i < txt.length; i++) {if (txt[i] == '#') {var m_type = "";while(i + 1 < txt.length && txt[i+1] != '$') {i++;m_type += txt[i];} mytype.push(m_type);} else if (txt[i] == '$') {var m_data = "";while(i + 1 < txt.length && txt[i+1] != '@') {i++;m_data += txt[i];} mydata.push(Number(m_data));} else {i++;}} // QualityIndexType = mytype;// QualityIndexData = mydata;}}xmlhttp.open("GET","http://www.test.com/getData.php?q=",false);xmlhttp.send();return {mytype,mydata}; }

總結

以上是生活随笔為你收集整理的开个定时器给echarts组件配置定时更新的全部內容，希望文章能夠幫你解決所遇到的問題。

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