饼图echarts 饼配置项内容和展示

      let index = 0;
    var colorList = ['#FF793A', '#0093FF', '#00E1FF', '#2D49D4'];
    var data = [     { name: '500kv线路', value: '10' },
          { name: '10kv线路  ', value: '40' },
          { name: '110kv线路', value: '30' },
          { name: '220kv线路', value: '20' }]
    option = {
    title: {
    x: 'center',
    y: 'center',
    textStyle: {
        fontSize: 20
    }
    },
    tooltip: {
    trigger: 'item'
    },
    legend: {
       orient: 'vertical',
       bottom: '0%',
        itemGap: 2,
       selectedMode: true,
       icon: 'bar',
       textStyle: {
         rich: {
             a: {
                 color: '#000',
                 width: 30
             },
             b0: {
                 color: '#73DDFF',
                 fontSize: 20,
                 padding: [0, 30, 0, 40]
             },
             b1: {
                 color: '#73ACFF',
                 fontSize: 20,
                 padding: [0, 30, 0, 40]
             },
             b2: {
                 color: '#FDD56A',
                 fontSize: 20,
                 padding: [0, 30, 0, 40]
             },
             b3: {
                 color: '#FDB36A',
                 fontSize: 20,
                 padding: [0, 30, 0, 40]
             },
    
         }
     },
     formatter: function(name) {
         let title = ''
         var total = 0;
         var target;
         var index;
         for (var i = 0, l = data.length; i < l; i++) {
             if (data[i].name == name) {
                 target = data[i].value;
                 title = data[i].label
                 index = i < 4 ? i : 3
             }
         }
         return `{a| ${name}}{b${index}| ${target}}个`
     }
       
   },
    series: [{
      type: 'pie',
            radius: '50%',
            center: ['45%', '30%'],
       roseType: 'radius',
            animationType: 'scale',
            animationEasing: 'elasticOut',
    emphasis:{
        itemStyle:{
            borderColor: '#f3f3f3',
            borderWidth: 10
        }
    },
    itemStyle: {
        normal: {
            color: function(params) {
                return colorList[params.dataIndex]
            }
        }
    },
    label: {
        show: true,
        position: 'outside',
        formatter: '{a|{c}}',
        rich: {
            hr: {
                backgroundColor: 't',
                borderRadius: 1,
                width: 1,
                height: 1,
                padding: [1, 1, 0, -4]
            },
            a: {
                padding: [-15, 7, -10, 7]
            }
        }
    },
    labelLine: {
        normal: {
            length: 2,
            length2: 2,
            lineStyle: {
                width: 1
            }
        }
    },
    data: data,
    }]
    };