d3.js – 填充D3数组嵌套中的空白

前端之家收集整理的这篇文章主要介绍了d3.js – 填充D3数组嵌套中的空白前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个数组或对象组成的日期和一些值:
var flatData = [
    { "date": "2012-05-26","product": "apple"  },{ "date": "2012-07-03","product": "orange" },...
]

我试图使用d3.nest()来按年份再按月获得这些对象的计数.

var nestedData = d3.nest()
    .key(function(d) { return d.date.split('-')[0]; })  // key is the year
    .sortKeys(d3.ascending)
    .key(function(d) {
        var splitDate = d.date.split('-');
        return splitDate[0] + '-' + splitDate[1]; // key is year-month
    })
    .sortKeys(d3.ascending)
    .rollup(function(d) {
        return d.length;
    })
    .entries(flatData);

这几乎可以工作,除了当一个月没有对象时,嵌套数据不包含该月份的计数为0的记录.告诉D3填补这些差距有什么诀窍吗?

(当然,我总是可以做到这一点,就是要循环遍历所有的嵌套级别,并创建一个填补空白的新数据结构.)

解决方法

尝试在减少之后添加缺少的数据点:
var flatData = [
    { "date": "2012-05-26","product": "orange" }]

nestedData = d3.nest()
    .key(function(d) { return d.date.split('-')[0]; })  // key is the year
    .sortKeys(d3.ascending)
    .key(function(d) {
        var splitDate = d.date.split('-');
        return splitDate[0] + '-' + splitDate[1]; // key is year-month
    })
    .sortKeys(d3.ascending)
    .rollup(function(d) {
        return d.length;
    })
    .entries(flatData);


yMFormat = d3.time.format('%Y-%m')

makeAllKeys = function(year) {
    allKeys = [];
    for(var i = 0; i<12;i++) {  // 12 months in a year
        allKeys.push(yMFormat(new Date(year,i,1)));
    }
    return allKeys;
}

nestedData = nestedData.map(function(yearObj) {
    return {
        values: makeAllKeys(+yearObj.key).map(function(k) { 
                value = yearObj.values.filter(function(v) { return v.key == k; })[0];
                return value || ({key: k,values: 0});
            })
    };
});
原文链接:https://www.f2er.com/js/154038.html

猜你在找的JavaScript相关文章