Echarts動態加載后台數據


注意:1、用Ajax請求獲取后台數據 2、Echarts只能處理Json數據

后台Controller:根據業務需求不同而返回不同數據,我前台要循環遍歷Echarts的series進行數據添加,所以后台返了個二維數組過去。

5

前端JSP頁面:為Echarts准備一個具有高寬的dom容器

jsp

前端JS:初始化時即加載Echarts,將不需要進行加載的配置項(例如title、tooltip等)不作改動,將需要動態加載數據的配置放入ajax的success:function(){}中進行處理。

js1

定義一個為series這個即將動態加入數據的配置項准備的名為Item的數組容器,

接着對后台返回過來的數據(childkind)進行遍歷,將遍歷出的數據賦給容器中的相應屬性(例:tp.name=childkind[i])。由於series里面的data屬性(接收的是數組數據)也需要進行數據動態加載,接着再定義一個list數組,循環寫入數據到list中,再將list數組返給tp.data。

最后再設置Echarst相關配置項。

js2


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM