Echarts - 一个让我很艹蛋的报表设计图

设计图如下：

用echarts实现，代码如下，无注释。

var myChart = echarts.init(document.getElementById('main'));
    var x = new Array();
    var optionx = new Array();
    var y = new Array();
    for(var i = 0; i < chartData.length; i++){
        for (item in chartData[i]){
            x.push(item);
            y.push(chartData[i][item]);
        }
    }
    for(var i = 0; i < x.length; i++){
        var index1 = x[i].indexOf('-') + 1;
        optionx.push(x[i].substring(index1,x[i].length));
    }
    
    // 指定图表的配置项和数据
    var option = {
        backgroundColor: "#FCFCFC",
        tooltip : {
            backgroundColor: "#17191D",
            trigger: 'axis',
            axisPointer: {
                type: "none",
                label: {
                    backgroundColor: '#6a7985'
                }
            },
            formatter: function(params, ticket, callback) {
                return '<div style="padding: 5px;overflow: hidden;"><div style="display: block;font-size: 12px;line-height: 14px;margin-bottom: 6px;">'+x[params[0].dataIndex]+'</div><div style="display: block;width: 1px;height: 9px;border-radius: 3px;background-color: #1890FF;margin-top: 2.5px;float: left;"></div><div style="display: block;float: left;margin-left: 7px;font-size: 12px;line-height: 14px;">'+params[0].data+'</div></div>';
            }
        },
        grid: {
            top: 0,
            bottom: 36,
            left: -20,
            right: -20
        },
        xAxis :{
            type : 'category',
            boundaryGap : false,
            axisLine : {
                show: false,
                lineStyle :{
                    color : "#C6D2DD"
                }
            },
            axisLabel: {
                color : "#666"
            },
            splitLine : {
                show: true,
                lineStyle :{
                    color : "#D7D8DA",
                    type : "dashed"
                }
            },
            axisTick : {
                show: false,
                lineStyle :{
                    color : "#EBEBEB"
                }
            },
            data : optionx
        },
        yAxis : {
            type : 'value',
            axisLine :{
                show: false
            },
            axisLabel : {
                show: false
            },
            splitLine : {
                show: false
            },
            axisTick : {
                show: false
            }
        },
        series : [
            {
                type:'line',
                stack: '总量',
                smooth : true,  //是否平滑显示
                symbolSize : 6,
                itemStyle : {
                    color: "#FFD205",
                    borderColor : "#FFD205",
                    borderWidth : 2
                },
                lineStyle : {
                    color : "#FFD205",
                    width : 4
                },
                areaStyle : {
                    color : "#FFF",
                    origin : "end",
                    opacity : 1
                },
                data:y
            }
        ]
    };

    myChart.setOption(option);