按highcharts中column形式转对象展现格式

 

highcharts图表type:column事例的格式是这样的：

（不论接口返回什么格式，需要转换的）：

xAxis: {
    categories: ['一月','二月'],
},
series: [
    {name: '东京',data: [49, 71]}, 
    {name: '纽约',data: [39, 71]}, 
    {name: '伦敦',data: [65, 59]}, 
    {name: '柏林',data: [60, 47]}
]

 

我们最终要得到 xAxis和series

接口返回的：

column:[
        {notValidCount: 1, time: "2020-03-30", validCount: 0},
        {notValidCount: 4, time: "2020-03-31", validCount: 0},
        {notValidCount: 7, time: "2020-04-01", validCount: 0},
        {notValidCount: 6, time: "2020-04-02", validCount: 0},
        {notValidCount: 0, time: "2020-04-03", validCount: 0},
        {notValidCount: 6, time: "2020-04-04", validCount: 0},
        {notValidCount: 5, time: "2020-04-05", validCount: 0},
]

　

我们要转换的格式，xAxis是time：

{
       notValidCount: [1, 4, 7, 6, 0, 6, 5],
       time:["2020-03-30", "2020-03-31", "2020-04-01", "2020-04-02", "2020-04-03","2020-04-04","2020-04-05"],
       validCount:[0, 0, 0, 0, 0, 0, 0]
}

　　

------------------------------------------------------------------ 

代码实现：

   var column =[
        {notValidCount: 1, time: "2020-03-30", validCount: 1},
        {notValidCount: 4, time: "2020-03-31", validCount: 1},
        {notValidCount: 7, time: "2020-04-01", validCount: 2},
        {notValidCount: 6, time: "2020-04-02", validCount: 2},
        {notValidCount: 2, time: "2020-04-03", validCount: 2},
        {notValidCount: 6, time: "2020-04-04", validCount: 2},
        {notValidCount: 5, time: "2020-04-05", validCount: 3},
    ];
    var xAxis = [];
    var dataNew = {};
    var series = [];
    for(var el in column[0]){
        dataNew[el] = [];
        //el 每个分类字段名
        column.forEach(function(item,index){
            //循环7次notValidCount里值 ，再time值
            dataNew[el].push(item[el])
        })
    }
    xAxis =  dataNew.time;
    var tableinfo = {
        'keliu':[
            {key:'notValidCount',name:'无效客流'},
            {key:'validCount',name:'有效客流'},
        ],
    }
    var originData = tableinfo['keliu'];
    var colors = ['#A10D30','#E98353','#F2C65C','#EC808D','#53B3E9'];
    originData.forEach(function(item,index){
        var type = 'column';
        series.push({
            type:type,
            name:item.name,
            color:colors[index],
            data:dataNew[item.key]
        })

    })
    console.log(xAxis,series,'希望的值')

　　

下边是xAxis和series的值：

 

 

 

图表：

 

 

 

 

 

 

 

标签：03,notValidCount,04,column,validCount,2020,time,格式,highcharts
来源： https://www.cnblogs.com/liubingyjui/p/12624686.html