使用d3.js计算CSV文件的行数

时间:2013-10-31 15:52:09

标签: javascript d3.js

假设我有这个CSV文件

Day,What
2013-10-27,Apple
2013-10-27,Cake
2013-10-27,Apple
2013-10-28,Apple
2013-10-28,Apple
2013-10-28,Blueberry
2013-10-28,Orange

我想用D3.js绘制一个时间序列图。我需要做的就是显示每天的行数总和。例如,11月27日应该有3个值,第28个应该有4个。

我有办法存档吗?我一直在尝试用CSV创建一个没有正面结果的新数据集。

var dataset;

d3.csv("data.csv", function(d) {
  return {
    Day: new Date(d.Day),
    What: d.What
  };
}, 

function(error, rows) {
    dataset = rows;
    // I SUPPOSE THE FUNCTION THAT GENERATE THE NEW DATASET SHOULD GO THERE     
});

2 个答案:

答案 0 :(得分:2)

您可以在累积计数时使用JavaScript对象属性的快速查找作为索引:

var counts = {};
rows.forEach(function(r) {
    if (!counts[r.Day]) {
        counts[r.Day] = 0;
    }
    counts[r.Day]++;
});

然后你需要将它转换回一个数组,这样你就可以在D3中使用它:

var data = [];
Object.keys(counts).forEach(function(key) {
    data.push({
        day: key,
        count: counts[key]
    });
});

我在这里假设您要忽略“什么”列,因为您只讨论了聚合天数,并且同一天有不同的“什么”值。如果您想要考虑“什么”,可以将其构建到原始counts对象(r.Day + r.What)的密钥中。

编辑:根据评论,使用复合键添加代码。

var counts = {};
rows.forEach(function(r) {
    var key = r.Day + r.What;
    if (!counts[key]) {
        counts[key] = {
           day: r.Day,
           what: r.What,
           count: 0
        };
    }
    counts[key].count++;
});

var data = [];
Object.keys(counts).forEach(function(key) {
    data.push(counts[key]);
});

答案 1 :(得分:0)

沿着这些方向的功能应该可以解决问题。我现在无法在电脑上测试它,所以请告诉我它是否有效,因为我可能会输入错字!

function createNewArray(dataset) {
  var lastDate = dataset[0].Date;  // initialise
  var count = 0;
  var newArray = new Array();
  for (var i = 0; i < dataset.length; i++) {
      if (dataset[i].Date != lastDate || i == dataset.length-1) {
          // on a new day (or the final row), so push value and reset count variable
          newArray.push({ Day: lastDate, Count: count });
          count = 0;
      }        
      count++;        
      lastDate = dataset[i].Date;
  }
  return newArray;
}