rich饼图标签echarts 饼配置项内容和展示

      
option = {
    tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b}: {c} ({d}%)"
    },
    color: ['#00E7E5', '#1DBEFF'],
    legend: {
        left: 'left',
        orient: 'vertical',
        bottom: 10,
        textStyle: {
            color: '#333',
            padding: [5, 5, 5, -42],
            fontWeight: 600,
        },
        itemWidth: 50,
        itemHeight: 22,
    },
    series: [{
        radius: 120,
        name: '访问来源',
        type: 'pie',
        labelLine: {
            length:40,
            length2: 85
        },
        itemStyle: {
            borderWidth: 1,
            shadowBlur: 20,
            shadowOffsetY: 5
        },
        avoidLabelOverlap: true,
        data: [{
                value: 150,
                name: '在线',
                selected: true,
                itemStyle: {
                    color: '#129E92',
                    borderColor: '#3FFFE2',
                    shadowColor: 'rgba(63, 255, 226, 0.5)',
                },
                labelLine: {
                    lineStyle: {
                        color: '#00EAE8'
                    }
                },
                label: {
                    formatter: '{e|}{d|}\n{a|}{b|100/500}{c|}',
                    rich: {
                        a: {
                            padding: -40,
                        },
                        c: {
                            height: 20,
                            width: 1,
                            padding: [5, 0],
                            lineHeight: 60,
                            verticalAlign: 'top',
                            backgroundColor: '#00EAE8',
                        },
                        b: {
                            color:'#00E7E5',
                            backgroundColor: 'rgba(63, 255, 226, 0.2)',
                            height: 19,
                            width:47,
                            borderRadius: 0,
                            padding: [5, 15],
                            verticalAlign: 'top',
                        },
                        d:{
                            height: 1,
                            width: 58,
                            padding: [0, 0],
                            backgroundColor: '#00EAE8',
                        },
                         e: {
                            padding: -30,
                        },
                    }
                },
            },
            {
                value: 310,
                name: '离线',
                itemStyle: {
                    color: '#105BA4',
                    borderColor: '#31B4FF',
                    shadowColor: 'rgba(49, 180, 255, 0.8)',
                },
                labelLine: {
                    lineStyle: {
                        color: '#07D2FF'
                    }
                },
                label: {
                    formatter: '{d|}{e|}\n{c|}{b|70/500}{a|}',
                    rich: {
                        a: {
                            padding: -40,
                        },
                        c: {
                            height: 20,
                            width: 1,
                            padding: [5, 0],
                            lineHeight: 60,
                            verticalAlign: 'top',
                            backgroundColor: '#07D2FF',
                        },
                        b: {
                            color:'#1DBEFF',
                            backgroundColor: 'rgba(49, 180, 255, 0.2)',
                            height: 19,
                            width:47,
                            borderRadius: 0,
                            padding: [5, 15],
                            verticalAlign: 'top',
                        },
                        d:{
                            height: 1,
                            width: 58,
                            padding: [0, 0],
                            backgroundColor: '#07D2FF',
                        },
                        e: {
                            padding: -30,
                        },
                    }
                },
            },
        ]
    }]
};