渐变柱状图echarts 柱状配置项内容和展示

配置项如下
      var option = {
        backgroundColor: '#1b1b1b',//背景色
        tooltip : {
            show: true,
            trigger: 'axis',
            axisPointer : {            // 坐标轴指示器,坐标轴触发有效
                type : 'shadow'        // 默认为直线,可选为:'line' | 'shadow'
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        title:{
            show: false,
            text: '离散率七天日平均分析',
            left: 'center',
            textStyle:{
                //文字颜色
                color:'#ccc',
                //字体大小
            fontSize:20
            }
        },
        xAxis : [
            {
                type : 'category',
                name: '',
                data : ['1月', '2月', '3月', '4月', '5月', '6月', '7月','8月','9月','10月','11月','12月'],
                //刻度线是否显示
                axisTick: {
                    show: false
                },
                // x轴的字体样式
                axisLabel: {        
                        show: true,
                        interval: 0, 
                        textStyle: {
                            color: '#3398DB',
                            fontSize:'16'
                        }
                },
                // 控制网格线是否显示
                splitLine: {
                        show: false, 
                        //  改变轴线颜色
                        lineStyle: {
                            // 使用深浅的间隔色
                            color: ['red']
                        }                            
                },
                // x轴的颜色和宽度
                axisLine:{
                    show: true,
                    lineStyle:{
                        color:'#193d4e',
                          width:1   //这里是坐标轴的宽度,可以去掉
                    }
                }
            }
        ],
        yAxis : [
            {
                type : 'value',
                name: '',
                //刻度线是否显示
                axisTick: {
                    show: false
                },
                 // y轴的字体样式
                axisLabel: {        
                        show: true,
                        formatter: "{value} %",
                        textStyle: {
                            color: '#3398DB',
                            fontSize:'16'
                        }
                },
                // 控制网格线是否显示
                splitLine: {
                        show: false, 
                        //  改变轴线颜色
                        lineStyle: {
                            // 使用深浅的间隔色
                            color: ['red']
                        }                            
                },
                // y轴的颜色和宽度
                axisLine:{
                    show: false,
                    lineStyle:{
                        color:'#3398DB',
                          width:1,   //这里是坐标轴的宽度,可以去掉
                    }
                }
            }
        ],
        series : [
           {
                name: '离散率',
                type: 'bar',
                barWidth: '20px',
                itemStyle: {
                    normal: {
                         //颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
                        color: new echarts.graphic.LinearGradient(
                            0, 0, 0, 1,
                            [
                                {offset: 0, color: '#193d4e'},
                                {offset: 0.5, color: '#29758a'},
                                {offset: 1, color: '#3cc0ce'}
                            ]
                        )
                    }
                },
                data:[5, 1, 6, 4, 2, -2, -1,-2,8,6,2,-3]
            }
        ]
    }
    
截图如下