echarts中餅圖的legend自定義icon圖片(扇形為例)

效果圖:

代碼:

問題:// icon: "pin", // 這個字段控制形狀 類型包括 circle，rect ，roundRect，triangle，diamond，pin，arrow，none滿足不了我們的時候,就可以自定義圖片

<div id="main" style="width: 268px;height:200px;"></div>

 

<script type="text/javascript">
    // 基於准備好的dom，初始化echarts實例
    var myChart_one = echarts.init(document.getElementById('main_one'));
    // 指定圖表的配置項和數據
    var option = {
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b}: {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            x: '160px',
            y: '30px',
            // data:['溫度報警0(0%)','竊電報警0(0%)','打火報警0(0%)','三相報警0(0%)','短路報警0(0%)','漏電報警0(0%)'],
            data:[
                {value:335, name:'溫度報警0(0%)',icon:'image://img/pin_1.jpg' },
                {value:310, name:'竊電報警0(0%)',icon:'image://img/pin_2.jpg' },
                {value:234, name:'打火報警0(0%)',icon:'image://img/pin_3.jpg' },
                {value:135, name:'三相報警0(0%)',icon:'image://img/pin_4.jpg' },
                {value:1548, name:'短路報警0(0%)',icon:'image://img/pin_5.jpg' },
                {value:1548, name:'漏電報警0(0%)',icon:'image://img/pin_6.jpg' }
            ],
            textStyle: {
                color: '#fff',  
                fontSize: '10'                    // 圖例文字顏色
            },
            icon:'image://img/1主頁.png' ,
            itemWidth: 16,             // 圖例圖形寬度
            itemHeight: 12,            // 圖例圖形高度
            // icon: "pin",   //  這個字段控制形狀  類型包括 circle，rect ，roundRect，triangle，diamond，pin，arrow，none
        },
        series: [
            {
                name:'訪問來源',
                type:'pie',
                radius: ['35%', '70%'],
                avoidLabelOverlap: false,
                center : ['30%', '50%'],
                label: {
                    normal: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        show: true,
                        textStyle: {
                            fontSize: '9',
                            fontWeight: 'bold'
                        }
                    }
                },
                labelLine: {
                    normal: {
                        show: false
                    }
                },
                data:[
                    {value:335, name:'溫度報警0(0%)'},
                    {value:310, name:'竊電報警0(0%)'},
                    {value:234, name:'打火報警0(0%)'},
                    {value:135, name:'三相報警0(0%)'},
                    {value:1548, name:'短路報警0(0%)'},
                    {value:1548, name:'漏電報警0(0%)'}
                ]
            }
        ]
    };
    // 使用剛指定的配置項和數據顯示圖表。
    myChart_one.setOption(option);
</script>