向 echarts图标工具栏toolbox中加入自定义图标／图形

首先参考一下官方文档：

接下来自己动手：

<!--chart1-->
<script type="text/javascript">
    var myChart = echarts.init(document.getElementById('chart1'));

    // 显示标题，图例和空的坐标轴
    myChart.setOption({
        tooltip: {
            show: true,
            trigger: 'axis',
            axisPointer: { // 坐标轴指示器，坐标轴触发有效
                type: 'line' // 默认为直线，可选为：'line' | 'shadow'
            }
        },
        toolbox: {
            show: true,
            feature: {
                myTool: {
                    show: true,
                    title: '自定义扩展方法',
                    icon:'image://images/more.png',
                    z:'999',
                    left:'center',
                    onclick: function (){
                        alert('myToolHandler2')
                    }
                }
            }
        },
        legend: {
            data: ['住户', '租户'],
            right: '10%',
            top: '20px'
        },
        itemStyle: {
            normal: {},
            emphasis: {
                barBorderWidth: 1,
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowOffsetY: 0,
                shadowColor: 'rgba(0,0,0,0.5)'
            }
        },
        title: {
            text: '居住人群统计',
            x: 'center'
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },

        xAxis: {
            data:   []
        },
        yAxis:{},
        series: [{
            name: '住户',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: 'insideRight'
                }
            },
            data: [320, 302, 301, 334, 390, 330, 320]
        },
            {
                name: '租户',
                type: 'bar',
                stack: '总量',
                label: {
                    normal: {
                        show: true,
                        position: 'insideRight'
                    }
                },
                data: [120, 132, 101, 134, 90, 230, 210]
            }]
    })

    // myChart.showLoading();    //数据加载完之前先显示一段简单的loading动画

    var xAxisData = [];
    var render = [];
    var residnet = [];

    $.ajax({
        type : "post",
        //  async : true,            //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）        url: "http://10.1.17.11:8090/safecity/examineEquipment",
        url: "http://10.1.17.11:8090/safecity/examineEquipment",
        data : {
            //需要读取
        },
        dataType : "json",        //返回数据形式为json
        success : function(result) {
            //请求成功时执行该函数内容，result即为服务器返回的json对象

        }

    })

</script>

注意红色部分，容易出错的是黄色高亮处的代码——

格式必须是：  icon : ' image://（图片／图标的路径) ' 

效果图如下：

右上角的‘点点点’就是我从font-awesome上找来的图标。