预测echarts 柱状配置项内容和展示

配置项如下
      var areaStyle = {
    silent: false,
    itemStyle: {
        normal: {
            color: 'rgba(146, 154, 199, 0)'
        }
    },
    data: [
        [{
            name: '',
            xAxis: '2018E',
            label: {
                normal: {
                    offset: [0, 100],
                    color: "#013678",
                    fontSize: 14
                }
            }
        }, {
            xAxis: '2020E'
        }]
    ]
}
var option = {
    
        toolbox: {
        show: true,
        feature: {
            mark: {
                show: true
            },
            dataView: {
                show: true,
                readOnly: false
            },
            magicType: {
                show: true,
                type: ['pie', 'funnel']
            },
            restore: {
                show: true
            },
            saveAsImage: {
                show: true,
                pixelRatio: 5
            }
        }
    },
    
    title: {
        //text: '项目需要的堆叠图',
        //subtext: 'gogoogogogo',
        x: 'center',
        align: 'right'
    },

    backgroundColor: '',
    color: ['#1c2f8a', ''],
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },
    legend: {
        x:'13%',
        top: '23%',
        data: ['市场规模','YOY%'],
        textStyle:{
            fontSize:20,
            fontWeight:500
        },
    },
    grid: { //图表的位置
        top: '20%',
        left: '3%',
        right: '4%',
        bottom: '5%',
        containLabel: true
    },
    yAxis: [{
        type: 'value',
        name:'亿元',
        nameTextStyle: {fontSize:30,fontWeight:500},
        min: 0,
        max: 1400,
        splitNumber: 4,
        splitLine: {
            show: true,
            lineStyle: {
                color: ['#f2f2f2']
            }
        },
        
        axisLabel: {        
                                show: true,
                                textStyle: {
                                    color: 'black',
                                    fontSize:'20',
                                    fontWeight:500
                                }
                            },
                            
        axisLine:{
                            lineStyle:{
                                color:'black',
                                  width:3.5,   //这里是坐标轴的宽度,可以去掉
                            }
                        },
    },
    
    {
        type: 'value',
        name:'年增长速度%',
        nameTextStyle: {fontSize: 30,fontWeight:500},
        min: 0,
        max: 12,
        splitNumber: 5,
                
        splitLine: {
            show: true,
            lineStyle: {
                color: ['#DDD']
            }
        },
        
        axisLabel: {        
                                show: true,
                                textStyle: {
                                    color: 'black',
                                    fontSize:'20',
                                    fontWeight:500
                                }
                            },
                            
        axisLine:{
                            lineStyle:{
                                color:'black',
                                  width:3.5,   //这里是坐标轴的宽度,可以去掉
                            }
                        },
    }
    
    
    ],
    xAxis: [{
        type: 'category',
        data: ['2019', '2020E', '2021E', '2022E','2023E','2024E','2025E'],
        
        axisLabel: {        
                                show: true,
                                textStyle: {
                                    color: 'black',
                                    fontSize:'30',
                                    fontWeight:500
                                }
                            },
                            
        axisLine:{
                            lineStyle:{
                                color:'black',
                                  width:3.5,   //这里是坐标轴的宽度,可以去掉
                            }
                        },
    }],
    series: [{
            name: '市场规模',
            type: 'bar',
            stack: '总量',
            color:'#013678',
            barWidth: '90px',
            

            
            data: [712.2,783.2,845.8,905,973.8,1061.4,1146.3],
            //加阴影

        },
        {
            name: 'YOY%',
            type: 'line',
            color:'#FD6467',
            yAxisIndex: 1,
            barWidth: '100px',
            itemStyle: {
                normal: {
                    lineStyle: {
                      width:8
                    }
                }
            },

            data: [ 8,10.2,7.8,7.2,7.6,9.1,8.2],
            markArea: areaStyle
        },
        
    ],
    
};








    
截图如下