echarts 柱状配置项内容和展示

配置项如下
      option = {
    backgroundColor: 'rgba(0,0,0,1)',
    color: ['#fff300', '#8ec31c', '#017afd', '#18db82', '#8a71fe', '#ea69a2', '#aed69a'],
    grid: {
        left: '3%',
        right: '50%',
        top: '5%',
        bottom: '15%',
        containLabel: true,
    },
    xAxis: {
        "show": false,
    },
    yAxis: {
        show: true,
        inverse: true,
        axisLine: {
            show: true,
            lineStyle: {
                color: '#06d3c4',
                width: 1
            }
        },
        splitLine: {
            show: false
        },
        axisTick: {
            show: false
        },
        axisLabel: {
            show: false,
            textStyle: {
                fontSize: 10,
                color: '#fff',
            },
            interval: 0
        },
        data: [2018, 2017, 2016], //横向bar必须有
    },
    series: [{
            name: '条',
            type: 'bar',
            yAxisIndex: 0,
            data: [{
                    name: '简易程序',
                    value: 10,
                    itemStyle: {
                        borderColor: 'rgb(0,198,255,0.75)',
                        borderWidth: 1,
                        color: 'rgb(0,198,255,0.35)'
                    }
                },
                {
                    name: '一般程序',
                    value: 20,
                    itemStyle: {
                        borderColor: 'rgb(138,0,255,0.75)',
                        borderWidth: 1,
                        color: 'rgb(138,0,255,0.35)'
                    }
                },
                {
                    name: '听证程序',
                    value: 30,
                    itemStyle: {
                        borderColor: 'rgb(228,0,127,0.75)',
                        borderWidth: 1,
                        color: 'rgb(228,0,127,0.35)'
                    }
                },
            ],
            barWidth: 9,
            itemStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
                            offset: 0,
                            color: '#ffaf47' // 0% 处的颜色
                        },
                        {
                            offset: 0.5,
                            color: '#ffce28' // 0% 处的颜色
                        },
                        {
                            offset: 1,
                            color: '#fff600' // 100% 处的颜色
                        }
                    ], false),
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'insideBottomLeft',
                    padding:[10,0],
                    formatter: '{b|{b}}{c|{c}起}',
                    rich: {
                        b: {
                            fontSize: 12,
                            color: '#fff',
                            align: 'left',
                            padding: 4
                        },
                        c: {
                            fontSize: 12,
                            color: '#06d3c4',
                        }
                    },
                    textStyle: {
                        color: '#ffaf47',
                        fontSize: '16',
                    }
                }
            },

        },
        {
            name: '',
            type: 'pie',
            radius: ['20%', '25%'], // 半径
            center: ['80%', '50%'], // 位置
            label: {
                normal: {
                    formatter: '{b|{b}}\n{hr|}\n{d|{d}%}{c|{c}起}',
                    rich: {
                        b: {
                            fontSize: 12,
                            color: '#fff',
                            align: 'left',
                            padding: 4
                        },
                        hr: {
                            borderColor: '#12EABE',
                            width: '100%',
                            borderWidth: 1,
                            height: 0,
                        },
                        d: {
                            fontSize: 12,
                            color: '#fff',
                            align: 'left',
                            padding: 4
                        },
                        c: {
                            fontSize: 12,
                            color: '#fff',
                        }
                    }
                }
            },
            avoidLabelOverlap: true, //是否启用防止标签重叠策略
            labelLine: {
                normal: {
                    show: true,
                    length: 20,
                    length2: 15,
                    lineStyle: {
                        opacity: 0.6,
                    },
                },
                emphasis: {
                    show: true
                }
            },
            data: [{
                    value: 10,
                    name: '警告'
                },
                {
                    value: 10,
                    name: '罚款'
                },
                {
                    value: 10,
                    name: '责令停产停业'
                },
                {
                    value: 10,
                    name: '没收违法所得'
                },
                {
                    value: 10,
                    name: '法律法规规定的其他行政处罚'
                },
                {
                    value: 10,
                    name: '行政拘留'
                },
                {
                    value: 10,
                    name: '暂扣或吊销许可证'
                },
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};
    
截图如下