TH Recordecharts 折线配置项内容和展示

A♠️A♥️A♣️A♦️️

配置项如下
      
var data_xwm = [
    {
        value: ['2019/07/04', -800]
    },
    {
        value: ['2019/07/05', 5300]
    },
    {
        value: ['2019/07/06', -450]
    },
    {
        value: ['2019/07/11', -550]
    },
    {
        value: ['2019/07/12', -1585]
    },
    {
        value: ['2019/07/13', -550]
    },
    {
        value: ['2019/07/19', -850]
    },
    {
        value: ['2019/07/20', -950]
    },
    {
        value: ['2019/07/26', 615]
    },
    {
        value: ['2019/07/27', -2500]
    }
]
var data_pengpai = [
    {
        value: ['2019/07/04', -3000]
    },
    {
        value: ['2019/07/05', 650]
    },
    {
        value: ['2019/07/06', 650]
    },
    {
        value: ['2019/07/11', 2350]
    },
    {
        value: ['2019/07/12', -4385]
    },
    {
        value: ['2019/07/13', -470]
    },
    {
        value: ['2019/07/19', 450]
    },
    {
        value: ['2019/07/20', 400]
    },
    {
        value: ['2019/07/26', 3000]
    },
    {
        value: ['2019/07/27', 3350]
    }
]

var data_liupan = [
    {
        value: ['2019/07/04', 1750]
    },
    {
        value: ['2019/07/05', 2600]
    },
    {
        value: ['2019/07/06', -1050]
    },
    {
        value: ['2019/07/11', 1100]
    },
    {
        value: ['2019/07/12', 1200]
    },
    {
        value: ['2019/07/13', -2580]
    },
    {
        value: ['2019/07/19', 100]
    },
    {
        value: ['2019/07/20', -1090]
    },
    {
        value: ['2019/07/26', -2370]
    },
    {
        value: ['2019/07/27', 800]
    }
]


var data_gaolin = [
    {
        value: ['2019/07/04', 2850]
    },
    {
        value: ['2019/07/05', -4450]
    },
    {
        value: ['2019/07/06', 0]
    },
    {
        value: ['2019/07/11', 1550]
    },
    {
        value: ['2019/07/12', -1575]
    },
    {
        value: ['2019/07/13', 1150]
    },
    {
        value: ['2019/07/19', -290]
    },
    {
        value: ['2019/07/20', 850]
    },
    {
        value: ['2019/07/26', -65]
    },
    {
        value: ['2019/07/27', 675]
    }
]

var data_tianyong = [
    {
        value: ['2019/07/04', -3100]
    },
    {
        value: ['2019/07/05', 130]
    },
    {
        value: ['2019/07/06', 1150]
    },
    {
        value: ['2019/07/11', -2000]
    },
    {
        value: ['2019/07/12', -385]
    },
    {
        value: ['2019/07/13', 2800]
    },
    {
        value: ['2019/07/19', 2100]
    },
    {
        value: ['2019/07/20', -1175]
    },
    {
        value: ['2019/07/26', -5120]
    },
    {
        value: ['2019/07/27', -1080]
    }
]

var data_yugang = [
    {
        value: ['2019/07/04', -200]
    },
    {
        value: ['2019/07/05', 0]
    },
    {
        value: ['2019/07/06', -2630]
    }
]

var data_teyi = [
    {
        value: ['2019/07/04', 5500]
    },
    {
        value: ['2019/07/05', -5000]
    },
    {
        value: ['2019/07/11', -3850]
    },
    {
        value: ['2019/07/12', 5850]
    },
    {
        value: ['2019/07/13', 900]
    },
    {
        value: ['2019/07/19', -3290]
    },
    {
        value: ['2019/07/26', 40]
    },
    {
        value: ['2019/07/27', -2700]
    }
]

var data_laodage = [
    {
        value: ['2019/07/04', -3500]
    },
    {
        value: ['2019/07/05', -1650]
    },
    {
        value: ['2019/07/13', -1000]
    },
    {
        value: ['2019/07/20', -100]
    },
    {
        value: ['2019/07/26', -150]
    }
]

var data_wuzhe = [
    {
        value: ['2019/07/04', 0]
    },
    {
        value: ['2019/07/05', 1080]
    },
    {
        value: ['2019/07/06', -80]
    },
    {
        value: ['2019/07/12', -1000]
    },
    {
        value: ['2019/07/13', 0]
    },
    {
        value: ['2019/07/19', 500]
    },
    {
        value: ['2019/07/20', 650]
    },
    {
        value: ['2019/07/26', 1450]
    },
    {
        value: ['2019/07/27', -920]
    }
]

var data_xiaoyong = [
    {
        value: ['2019/07/04', 0]
    },
    {
        value: ['2019/07/05', -400]
    },
    {
        value: ['2019/07/06', 350]
    },
    {
        value: ['2019/07/11', -150]
    },
    {
        value: ['2019/07/12', 800]
    },
    {
        value: ['2019/07/13', -3100]
    }
]

var data_tfh = [
    {
        value: ['2019/07/04', 0]
    },
    {
        value: ['2019/07/05', 0]
    },
    {
        value: ['2019/07/06', 0]
    },
    {
        value: ['2019/07/19', 600]
    },
    {
        value: ['2019/07/20', -1300]
    }
]

var data_leilei =[
    {
        value: ['2019/07/12', -800]
    },
    {
        value: ['2019/07/13', 850]
    },
    {
        value: ['2019/07/19', -800]
    },
    {
        value: ['2019/07/20', 800]
    },
    {
        value: ['2019/07/26', 1080]
    },
    {
        value: ['2019/07/27', 1600]
    }
]
var data_jiefuliu =[
    {
        value: ['2019/07/04', 0]
    },
    {
        value: ['2019/07/27', -1500]
    }
]

var gangzi = [
    {
        value: ['2019/07/04', 2090]
    },
    {
        value: ['2019/07/05', 1740]
    },
    {
        value: ['2019/07/06', 2100]
    },
    {
        value: ['2019/07/11', 1500]
    },
    {
        value: ['2019/07/12', 1900]
    },
    {
        value: ['2019/07/13', 2000]
    },
    {
        value: ['2019/07/19', 1500]
    },
    {
        value: ['2019/07/20', 2450]
    },
    {
        value: ['2019/07/26', 1520]
    },
    {
        value: ['2019/07/27', 2620]
    }
]

var pp_total = 0;
for(i=0;i<data_pengpai.length;i++){
    pp_total+=data_pengpai[i].value[1];
}

var lp_total = 0;
for(i=0;i<data_liupan.length;i++){
    lp_total+=data_liupan[i].value[1];
}

var xwm_total = 0;
for(i=0;i<data_xwm.length;i++){
    xwm_total+=data_xwm[i].value[1];
}

var gl_total = 0;
for(i=0;i<data_gaolin.length;i++){
    gl_total+=data_gaolin[i].value[1];
}

var ty_total = 0;
for(i=0;i<data_tianyong.length;i++){
    ty_total+=data_tianyong[i].value[1];
}


var yg_total = 0;
for(i=0;i<data_yugang.length;i++){
    yg_total+=data_yugang[i].value[1];
}

var teyi_total = 0;
for(i=0;i<data_teyi.length;i++){
    teyi_total+=data_teyi[i].value[1];
}

var ldg_total = 0;
for(i=0;i<data_laodage.length;i++){
    ldg_total+=data_laodage[i].value[1];
}

var wz_total = 0;
for(i=0;i<data_wuzhe.length;i++){
    wz_total+=data_wuzhe[i].value[1];
}

var lx_total = 0;
for(i=0;i<data_xiaoyong.length;i++){
    lx_total+=data_xiaoyong[i].value[1];
}

var tfh_total = 0;
for(i=0;i<data_tfh.length;i++){
    tfh_total+=data_tfh[i].value[1];
}

var leilei_total = 0;
for(i=0;i<data_leilei.length;i++){
    leilei_total+=data_leilei[i].value[1];
}

var jiefuliu_total = 0;
for(i=0;i<data_jiefuliu.length;i++){
    jiefuliu_total+=data_jiefuliu[i].value[1];
}

var gz_total = 0;
for(i=0;i<gangzi.length;i++){
    gz_total+=gangzi[i].value[1];
}

var totalarr =[];
totalarr.push({name:'囧尼蹦',score:pp_total});
totalarr.push({name:'老牛',score:lp_total});
totalarr.push({name:'明明',score:xwm_total});
totalarr.push({name:'睾林',score:gl_total});
totalarr.push({name:'小甜甜',score:ty_total});
totalarr.push({name:'鱼缸',score:yg_total});
totalarr.push({name:'特意',score:teyi_total});
totalarr.push({name:'老打鸽',score:ldg_total});
totalarr.push({name:'没辙',score:wz_total});
totalarr.push({name:'乡喷厨',score:lx_total});
totalarr.push({name:'疼放红',score:tfh_total});
totalarr.push({name:'内内',score:leilei_total});
totalarr.push({name:'洁肤流',score:jiefuliu_total});
totalarr.push({name:'杠子',score:gz_total});

function compare(property){
    return function(a,b){
        var value1 = a[property];
        var value2 = b[property];
        return value2 - value1;
    }
}

var sort_totalarr=totalarr.sort(compare('score'));

var zongjilu_text = "" ;


for(i=0;i<sort_totalarr.length;i++){
    zongjilu_text=zongjilu_text+sort_totalarr[i].name+":"+sort_totalarr[i].score+"\\n";
}

var option = {
    backgroundColor: "#B0E0E6",
    title: {
        text: '点击查看排名',
        top:'5%',
        link: "javascript: alert('"+zongjilu_text+"')",
        target: "self",
        x:'center',
        top:'10%'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            label: {
                backgroundColor: '#FF00FF'
            }
        }
    },
    grid:{
        top:100
    },
    legend: {
        data: ['囧尼蹦', '老牛','明明','睾林','小甜甜','鱼缸','特意','老打鸽','没辙','乡喷厨','疼放红','内内','洁肤流','杠子'],
        x: 'left',
        right:'100%'

    },
    dataZoom: [{
            type: 'slider', //图表下方的伸缩条
            show: true, //是否显示
            realtime: true, //拖动时,是否实时更新系列的视图
            start: 0, //伸缩条开始位置(1-100),可以随时更改
            end: 100, //伸缩条结束位置(1-100),可以随时更改
        },
        {
            type: "inside" //鼠标滚轮缩放
        }
    ],
    xAxis: {
        name: '月/日/年',
        type: 'time',
        splitLine: {
            show: false
        }
    },
    yAxis: {
        name: 'profit',
        type: 'value',
        max: value => {
            max = value.max;
            return (value.max * 1.5).toFixed(0); // 乘的目的是不想让图表顶到最顶部
        },
        min: value => {
            min = value.min;
            return (value.min * 1.5).toFixed(0);
        }
    },
    toolbox: {
        show: true,
        orient:'vertical',
        feature: {
            dataZoom: {
                yAxisIndex: 'none'
            },
            // dataView: {readOnly: false},
            magicType: {
                type: ['line', 'bar']
            },
            restore: {},
            saveAsImage: {}
        }
    },
    series: [{
            name: '囧尼蹦',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_pengpai,
        },
        {
            name: '老牛',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_liupan
        },
        {
            name: '明明',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_xwm
        },
        {
            name: '睾林',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_gaolin
        },
        {
            name: '小甜甜',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_tianyong
        },
        {
            name: '鱼缸',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_yugang
        },
        {
            name: '特意',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_teyi
        },
        {
            name: '老打鸽',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_laodage
        },
        {
            name: '没辙',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_wuzhe
        },
        {
            name: '乡喷厨',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_xiaoyong
        },
        {
            name: '疼放红',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_tfh
        },
        {
            name: '内内',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_leilei
        },
        {
            name: '洁肤流',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data_jiefuliu
        },
        {
            name: '杠子',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: gangzi
        }
        
    ]
};
    
截图如下