Echarts關於tree樹資料渲染圖例最新例項

呵呵,你不懂——渣渣發表於2020-05-17

最近做專案接到新的需求,根據本身系統結構資料做一個圖形化展示,要求好看易用,有互動,就說了這麼多,然後就要求兩天給一版瞅瞅,MMP,真把前端當神了(你倒是把待遇提到神的地位啊...)

唉,吐槽歸吐槽,還得做,主要是丟不起這個臉....

言歸正傳,準備echarts,jquery,ui用的layui。

初始頁面效果圖:

 

 預設展開系統與子系統。

效果分析:系統與子系統有子資料時,圖例渲染為實心圓,顏色不同區分,無子資料時為空心圓。

點選2級子系統空心圓時提示:

 

 有資料時點選實心圓請求子系統下資料載入例項

 

 然後點選某一個載入詳情檢視

 

 

 

 ,就是這樣的一個效果。。

後續有時間再更新,其他小夥伴有需要用到的可以私信我要完整版程式碼!!!!

彩蛋:

 

 一個為重新整理還原按鈕,一個為儲存圖例為圖片的按鈕:效果槓槓的...

 

 

相關文章