Angular nvD3 堆积面积图数据系列格式

Question

我正在尝试在 nvD3 堆积面积图中使用我自己的数据。来自 Angular nvD3 站点的示例数据格式格式如下：

[{
     "key":"Series 1",
     "values":[[1025409600000,0],[1028088000000,-6.3382185140371]]
},
{
     "key":"Series 2",
     "values":[[1025409600000,0],[1028088000000,0]]
}]

我的数据库中有以下格式的数据：

[{
     "Loc_Cnt":6,"Num_Cars":552,"Num_Employees":34,"active_month":"2017-10-01T00:00:00"
},
{
     "Loc_Cnt":4,"Num_Cars":252,"Num_Employees":14,"active_month":"2017-11-01T00:00:00"
}]

我正在尝试根据我的数据绘制图表，三个系列（系列 1：Flt_Cnt、系列 2：Num_Cars、系列 3：Num_Employees）。对于每个系列，X 轴值为 active_month 日期，Y 轴值为系列值。

我如何才能 A) 轻松地将我的数据转换为看起来像样本数据，或 B) 按 AngularJs nvd3 图表中的原样使用我的数据？我觉得数组上的 .forEach 对于较大的数据集效率不高，而且不那么容易阅读。我尝试以某种方式使用 d3.nest，但无法获得正确的格式。感谢您的帮助！

Answer 1

这不是很优雅，但我用暴力破解了我的解决方案。如果有更好的解决方案，请告诉我。

var Loc_Cnt = [];
var Num_Cars = [];
var Num_Employees = [];
var obj = {};

//arr is the array of values in my format
arr.forEach(function (element) {
    //need the date in milisecond format
    var date = new Date(element.active_month);
    var time = date.getTime();
    
    //load corresponding arrays
    Loc_Cnt.push([time, element.Loc_Cnt]);
    Num_Cars.push([time, element.Num_Cars]);
    Num_Employees.push([time, element.Num_Employees]);
});

//load each key/values pair into new object
obj["Loc_Cnt"] = Loc_Cnt;
obj["Num_Cars"] = Num_Cars;
obj["Num_Employees"] = Num_Employees;

//d3.entries creates an object of key/VALUEs
arrRollup = d3.entries(obj);

//change the key word values to value
var i;
for (i = 0; i < arrRollup.length; i++) {
    arrRollup[i].values = arrRollup[i]['value'];
    delete arrRollup[i].value;
}

Angular nvD3 堆积面积图数据系列格式

Angular nvD3 Stacked Area Chart Data Series Format

javascript

d3.js

nvd3.js

angular-nvd3