苍南县损失情况echarts 柱状配置项内容和展示

配置项如下
      option = {

    baseOption: {
        timeline: {
            top: 30,
            show: true,
            type: 'slider',
            axisType: 'category',
            currentIndex: 0, //0 时表示当前选中项为 timeline.data[0](即使用 options[0]
            autoPlay: false, //是否自动播放
            realtime: true, //拖动圆点的时候,是否实时更新视图。
            controlPosition: 'right',
            lineStyle: {
                show: false, //false 不显示轴线
            },
            controlStyle: { //控制按钮的样式
                show: false,
            },
            data: ['苍南县单次损失分布', '苍南县年总损失分布'],
        },
        tooltip: { //提示框组件
            trigger: 'axis',
            formatter: '{b}<br />{a0}: {c0}%',
            axisPointer: {
                type: 'shadow',
                label: {
                    backgroundColor: '#6a7985'
                }
            },
            textStyle: {
                color: '#FFFFFF',
                fontStyle: 'normal',
                fontFamily: '微软雅黑',
                fontSize: 12,
            }
        },
        grid: {
            left: 50,
            right: 50,
            bottom: 80,
            top: 100,
            containLabel: true,
        },
        xAxis: [{
            type: 'category',
            data: ['小于0.1亿元', '0.1-0.5亿元', '0.5-1亿元', '1-2亿元', '2-5亿元', '5-10亿元', '10-20亿元', '20-25亿元', '大于25亿元'],
            axisLabel: { //坐标轴刻度标签的相关设置。
                interval: 0, //设置为 1,表示『隔一个标签显示一个标签』
                margin: 15,
                textStyle: {
                    color: '#000000',
                    fontStyle: 'normal',
                    fontFamily: '微软雅黑',
                    //fontSize: 15,
                }
            }
        }],

        yAxis: [{
            type: 'value',
            axisLabel: {
                interval: 0, //设置为 1,表示『隔一个标签显示一个标签』
                margin: 15,
                textStyle: {
                    color: '#000000',
                    fontStyle: 'normal',
                    fontFamily: '微软雅黑',
                   // fontSize: 15
                },
                formatter: '{value} %'
            }
        }],
        series: [{
            name: '百分比',
            type: 'bar',
            itemStyle: {
                //通常情况下:
                normal: {             //每个柱子的颜色即为colorList数组里的每一项,如果柱子数目多于colorList的长度,则柱子颜色循环使用该数组
                    color: function(params) {
                        var colorList = ['#008000', '#32CD32', '#BDB76B', '#FFD700', '#FFA500', '#FF4500', '#FF0000'];
                        return colorList[params.dataIndex];
                    }
                },
                //鼠标悬停时:
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'top',
                    formatter: '{c0}%',

                    color: '#000000'
                }
            },
        }]
    },
    options: [{
            title: {
                text: '苍南县损失情况'
            },
            series: [{
                data: [0, 2, 5, 18, 42, 22, 9, 0.3, 0]
            }, ]
        },
        {
            series: [{
                data: [17, 0, 1, 6, 22, 26, 24, 4, 0]
            }, ]
        },
    ]
};
    
截图如下