echarts 折线配置项内容和展示

配置项如下
      var data1 = [636, 1134, 673, 100, 140];
var data2 = [309, 510, 442, 64, 82];
var data3 = [83, 233, 299, 15, 20];
var data4 = [419, 1969, 1140, 271, 316];
var data5 = [227, 274, 363, 42, 47];
var data6 = [207, 170, 187, 11, 30];
var xAxisData = ['禅城区', '南海区', '顺德区', '高明区', '三水区'];

var dataTotal = function() {
    var data = [];
    for (var i = 0; i < data1.length; i++) {
        data.push(data1[i] + data2[i] + data3[i] + data4[i] + data5[i] + data6[i]);
    }

    return data;
}
option = {
    color: ['#00a2ff', '#b0df9b', '#deef81', '#f8f872', '#7debf2', '#2ae2f2'],
    backgroundColor: '#000',
    legend: {
        right: '0%',
        bottom: '8%',
        itemWidth: 20,
        itemHeight: 20,
        textStyle: {
            color: '#ddd',
            fontSize: 22
        },
        orient: 'vertical',
        data: ['(商品)房屋', '(商品)食品', '(商品)日用百货', '(服务)制作和保养服务', '(服务)餐饮服务', '(服务)物业服务'],


    },
    tooltip: {
        show: true,
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            crossStyle: {
                color: '#ddd',
            },

        },
    },

    grid: {
        left: '1%',
        right: '23%',
        top: 80,
        bottom: 50,
        containLabel: true,
    },
    xAxis: {
        show: true,

        axisLabel: {
            interval: 0,
            rotate: 0,
            margin: 10,
            textStyle: {
                color: '#fff',
                align: 'center',
                fontSize: 22
            },
        },
        axisLine: {
            lineStyle: {
                color: '#3399ff',
                width: 2
            }
        },
        axisTick: {
            alignWithLabel: true,
            lineStyle: {
                color: 'none',

            },
        },
        data: xAxisData
    },
    yAxis: [{
        type: 'value',
        name: '',
        nameTextStyle: {
            color: '#fff',
            fontSize: 22
        },
        splitNumber: 4,
        axisLabel: {
            margin: 15,
            textStyle: {
                color: '#fff',
                fontSize:22
            },

        },
        axisLine: {
            lineStyle: {
                color: '#3399ff',
                width: 2
            }
        },
        axisTick: {
            alignWithLabel: true,
            length: 10,
            lineStyle: {
                color: '#3399ff',
                width: 2
            },
        },
        splitLine: {
            show: false,
        },
    }],
    series: [{
        name: '整合值',
        type: 'line',
        stack: '总量',
        smooth: true,
        data: dataTotal(),
        lineStyle: {
            normal: {
                width: 0
            }
        },
        symbolSize: 1,
        itemStyle: {
            normal: {
                borderWidth: 0
            }
        },
        label: {
            normal: {
                show: true,
                offset: [0, -10],
                position: 'top',
                textStyle: {
                    color: '#fff',
                    fontSize: 22
                }
            }
        },
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        type: 'bar',
        name: '(商品)房屋',
        stack: '问题',
        data: data1,
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        barMaxWidth: '50%',
        type: 'bar',
        name: '(商品)食品',
        stack: '问题',
        data: data2,
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        type: 'bar',
        name: '(商品)日用百货',
        stack: '问题',
        data: data3,
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        type: 'bar',
        name: '(服务)制作和保养服务',
        stack: '问题',
        data: data4,
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        type: 'bar',
        name: '(服务)餐饮服务',
        stack: '问题',
        data: data5,
    }, {
        itemStyle: {
            normal: {
                show: true,
                barBorderRadius: 5,
            }
        },
        type: 'bar',
        name: '(服务)物业服务',
        stack: '问题',
        data: data6,
    }]
};

    
截图如下