d3js汇总一个嵌套的JSON数组并求和一个总值

Question

我有这个JSON

[{
"month": "september",
"detail": [{
"date": "01-09",
"value": 5
}, {
"date": "02-09",
"value": 5
}, {
"date": "03-09",
"value": 5
}, {
"date": "04-09",
"value": 5
}, {
"date": "05-09",
"value": 5
}, {
"date": "06-09",
"value": 5
}, {
"date": "07-09",
"value": 0
}]
},
{
"month": "october",
"detail": [{
"date": "01-10",
"value": 10
}, {
"date": "02-10",
"value": 5
}, {
"date": "03-10",
"value": 5
}, {
"date": "04-10",
"value": 5
}, {
"date": "05-10",
"value": 5
}, {
"date": "07-10",
"value": 10
}]
}

我想使用d3nest为每个特定月份汇总对象"detail"中的所有"值"。如果你计算每个特定月份的所有值，结果会是：九月值：30&10月价值：40。

我试过嵌套它，但我无法正确地总结每个月的值。查看我的代码。

d3.json('runningdata.json', function (error, data) {
console.log(data);
var Total = d3.nest()
.key(function(d) { return d.month; })
.rollup(function(value) { return d3.sum(value, function(v) { return v.detail.value; }); })
.entries(data);
console.log(JSON.stringify(Total));
});

以上所有这些都将导致：

[{"key":"september","values":0},{"key":"october","values":0}]

你可以注意到"钥匙"工作正常，他们有一个月的价值。但"值"字段的结果为0。我想要达到的目标必须是：

[{"key":"september","values":30},{"key":"october","values":40}]

但当我尝试这个：

.rollup(function(value) { return d3.sum(value, function(v) { return v.detail[0].value; }); })

而不是：

.rollup(function(value) { return d3.sum(value, function(v) { return v.detail.value; }); })

它显示了数组中第一个对象的值。

[{"key":"september","values":5},{"key":"october","values":10}]

我做错了什么？我一直在读有关d3嵌套的文章。欢迎任何帮助。

注：我试图实现这一点，制作一张图表，显示每个月的总数，当你点击特定的月份时，它将以天为单位查看其月份的详细信息。

Answer 1

您必须更新d3.sum函数，如下所示：

d3.sum(value[0].detail, function(v) {
return v.value;
});

所以你的整个代码是：

var Total = d3.nest()
.key(function(d) {
return d.month;
})
.rollup(function(value) {
return d3.sum(value[0].detail, function(v) {
return v.value;
});
})
.entries(data);

Answer 2

您只需使用基本的javascript.reduce()函数即可完成此操作。这将把对象结构的数组汇总到一个对象中，以月份为属性名称，以值的总和为值。这样做的好处是，如果你想得到9月份的总数，你可以简单地说combined.september，而不必遍历数组，搜索key属性等于"的对象；九月；然后提取该值。但是，如果您需要保留原来的结构，请参阅我答案底部的略微修改版本。

var data = [{
"month": "september",
"detail": [{
"date": "01-09",
"value": 5
}, {
"date": "02-09",
"value": 5
}, {
"date": "03-09",
"value": 5
}, {
"date": "04-09",
"value": 5
}, {
"date": "05-09",
"value": 5
}, {
"date": "06-09",
"value": 5
}, {
"date": "07-09",
"value": 0
}]
},
{
"month": "october",
"detail": [{
"date": "01-10",
"value": 10
}, {
"date": "02-10",
"value": 5
}, {
"date": "03-10",
"value": 5
}, {
"date": "04-10",
"value": 5
}, {
"date": "05-10",
"value": 5
}, {
"date": "07-10",
"value": 10
}]
}];
var combined = data.reduce(function (total, current){
total[current.month] = current.detail.reduce(function(tot, curr) {
return tot + curr.value;
}, 0);
return total;
}, {});
console.log(combined);

编辑--如果您需要保留原来的{"键"：".."，"值"，".."}结构

你可以使用.map()而不是.reduce()，就像这样：

var combined = data.map(function (elem){
var total = elem.detail.reduce(function(total, current) {
return total + current.value;
}, 0);
return {key: elem.month, values: total};
});
console.log(combined); 
// output:
// [ { key: 'september', value: 30 },
//   { key: 'october', value: 40 } ]