echarts中toolbox增加自定义图标和事件

               

1、echarts提供了丰富的图标，如提供了

 saveAsImage保存图片

  restore 配置项还原

 dataView数据视图工具

  dataZoom 数据区域缩放

 magicType 动态类型切换

 brush 选择组件的控制按钮等。

2、在实际开发过程中，根据需求需要自定义图标及功能

3、实现方式：

除了各个内置的工具按钮外，还可以自定义工具按钮。echarts官方配置文档中中为

注意，自定义的工具名字，只能以 my 开头，例如myTool1，myTool2：

toolbox: {        feature: {            myTool1: {                show: true,                title: '自定义扩展方法1',                icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614,593.479,423.062,591.891,421.146,591.891L421.146,591.891zM421.146,591.891',                onclick: function (){                    alert('myToolHandler1')                }            },            myTool2: {                show: true,                title: '自定义扩展方法',                icon: 'image://http://echarts.baidu.com/images/favicon.png',                onclick: function (){                    alert('myToolHandler2')                }            }        }    }

注意点：icon的设置需要通过 'image://url' 设置为图片，其中 URL 为图片的链接，或者 dataURI。

（1）、URL 为图片链接例如：