柱状图叠加+折线图echarts 柱状配置项内容和展示

      
option = {
    backgroundColor:'#000',
        grid:{
        y2:'30',
        x:'50',
        y:'100',
        x2:'15',
    },
    legend: {
        x:'25',
        y:'50',
        itemWidth: 15,
        itemHeight:'10',
                data: [
            {
                name:'已完成',
                textStyle:{fontWeight:'bold', color:'#e8e8dc',fontSize: '10'},
            },  
                        {
                name:'未完成',
                textStyle:{fontWeight:'bold', color:'#e8e8dc',fontSize: '10'},
            },  
                        {
                name:'完成率',
                textStyle:{fontWeight:'bold', color:'#0eddfd',fontSize: '10',}, 
            },
        ]
        
    },
        title: {
        text: '本年回款完成情况(万元)',
        left: 'center',
        top: 20,
        textStyle: {
            color: '#d9efff'
        }
    },
    xAxis: [
        {
            type: 'category',
            data : ['江宁金茂悦','进击九月森林','进击九月森林','进击九月森林','进击九月森林','进击九月森林','进击九月森林','进击九月森林','进击九月森林'],
             axisLabel: {
            show: true,
            interval:0,  
            textStyle: {
                color: '#d2d4da'
            }
        },
        axisLabel:{
            interval:0,
            textStyle: {
                color: '#d2d4da',
                fontSize:'9',
            }
      },  
        }
    ],
    yAxis: [
        {
            type: 'value',
            // interval: 50,
             scale: true,
        splitLine: {
            lineStyle: {
                color:'#1f3054'
            },
        },
                   axisLabel:{
                textStyle: {
                    color: '#d2d4da',
                    fontSize:'9',
                }
          },          
          axisLine: {
            lineStyle: {
                color: '#1f3054', // 颜色
                width: 1, // 粗细
            }
        }
        },
        {
            type: 'value',
            show: false,
            interval: 1,            
            axisLabel: {  
                  show: true,  
                  interval: 'auto',  
                  formatter: '{value} %'  
                }, 

        }
    ],
    series: [
        {
            name: '已完成',
            barWidth : 10,
            borderWidth:'0',
            type: 'bar',
            stack:  '总量',
            itemStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                        offset: 1,
                        color: "#3893e5" // 0% 处的颜色
                    }, 
                     {
                        offset: 0,
                        color: "#00ffff" // 100% 处的颜色
                    }], false),
                },
            },
             label: {
                normal: {
                    color:'#fff',
                    show: true,
                    position: 'inside',
                    zlevel:'1000',
                }
            },
            data: [98, 68, 100, 40, 30, 68, 100, 40, 20]
        },
        {
            name: '未完成',
            type: 'bar',
            stack: '总量',
            itemStyle: {
                normal: {
                    color: '#626262'
                },
            },
            label: {
                normal: {
                    color:'#dbdde2',
                    show: true,
                    position: 'inside'
                }
            },
            data:[100, 100, 100, 100, 100, 100, 100, 100, 100]
        },
                {
                name: '总计',
                type: 'bar',
                stack: '总量',
                label: {
                    normal: {
                        // offset:['50', '80'],
                        show: true,
                        position: 'top',
                        formatter:'{c}',
                        textStyle:{ color:'#fff' }
                    }
                },
                itemStyle:{
                    normal:{
                        color:'rgba(128, 128, 128, 0)'
                    }
                },
                data:[0, 0, 0, 0, 0, 0, 0, 0, 0]
            },
        {
            name:'完成率',
            symbol:'circle',
            symbolSize :8,
            smooth:true,
            type:'line',
            yAxisIndex: 1,
            data:[0,74,98,48,48,74,98,48,100],
                  itemStyle: {
    normal: {
        color:'#0eddfd',
        label: {
            show: true,
            position: "top",
            formatter:'{c}%',
            borderWidth:10,
            color:'#0eddfd',
            padding:4,
            
        },
        labelLine: {
            show: false
        }
    } ,

}
        }
    ]
};
// var series = option["series"];
//         var fun = function (params) { 
//                 var data3 =0;
//                 for(var i=0,l=series.length-1;i<l;i++){
//                     console.log(series[i].data[params.dataIndex])
//                     data3 += series[i].data[params.dataIndex]
                    
//                 }
//                 console.log(data3)
//                 return data3
//             }
//         //加载页面时候替换最后一个series的formatter
//         series[series.length-1]["label"]["normal"]["formatter"] = fun 
//         // 使用刚指定的配置项和数据显示图表。
// if (option && typeof option === "object") {
//     myChart.setOption(option, true);
// }