Echart 自定義 legend (圖例)


最近項目中使用echarts,下面來總結下echart圖例(legend)的三種修改方式:

一、Echarts 提供的標記類型包括 : circle,rect,roundRect, triangle,diamond, pin , arrow, none

二、如果以上幾種類型不滿足業務需求,還可以設置自定義圖片   'image://url'  url為圖片鏈接   或者 dataURI

  legend:[

   {

    name: '小仙女',

    icon: 'image:// http://xxx.xxxx/a/b.png '

   },

  ]

  URI 為dataURI :

    'image://data:image/git;base64,..............................................'

  注意:自定義圖片的時候,在icon點擊的不顯示的時候無法灰掉,當然你可以通過 legendToggleSelect 控制點擊后的圖例,這個就看個人喜好了,我比較傾向於第三種方式

三、通過svg path 設置為任意的矢量路徑,可以設置任意顏色,大小  

  具體path路徑可以通過AI畫出icon,然后通過阿里圖標庫轉換拿到path路徑

 


免責聲明!

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



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