ECharts自訂toolbox中增加自訂按鈕

標籤：echarts   自訂工具按鈕   magictype   toolbox   

今天想能不能在ECharts中的ToolBox增加自己的按鈕，然後讀了一下ToolBox代碼，自己試了試，驗證是可以的。

1、

圖片中紅色框起來的按鈕

2、代碼

selfButtons:{//自訂按鈕 danielinbiti,這裡增加，selfbuttons可以隨便取名字                   show:true,//是否顯示                   title:'自訂', //滑鼠移動上去顯示的文字                   icon:'test.png', //表徵圖                   option:{},                   onclick:function(option1) {//點擊事件,這裡的option1是chart的option資訊                         alert('1');//這裡可以加入自己的處理代碼，切換不同的圖形                         }                    }

當然，內建了很多表徵圖，這些表徵圖都是畫出來的。

iconLibrary: {            mark: _iconMark,            markUndo: _iconMarkUndo,            markClear: _iconMarkClear,            dataZoom: _iconDataZoom,            dataZoomReset: _iconDataZoomReset,            restore: _iconRestore,            lineChart: _iconLineChart,            barChart: _iconBarChart,            pieChart: _iconPieChart,            funnelChart: _iconFunnelChart,            forceChart: _iconForceChart,            chordChart: _iconChordChart,            stackChart: _iconStackChart,            tiledChart: _iconTiledChart,            dataView: _iconDataView,            saveAsImage: _iconSave,            cross: _iconCross,            circle: _iconCircle,            rectangle: _iconRectangle,            triangle: _iconTriangle,            diamond: _iconDiamond,            arrow: _iconArrow,            star: _iconStar,            heart: _iconHeart,            droplet: _iconDroplet,            pin: _iconPin,            image: _iconImage        }

帶chart尾碼的都放在magicType的type中，同時尾碼chart不用，程式裡會自動拼接，比如lineChart，寫‘line‘

ECharts自訂toolbox中增加自訂按鈕