0

我在过滤数据 csv和更新SVG.D3.js

第一期

在加载时，我想从 csv 中过滤出多行。我成功地加载了数据并过滤了一行。然后我对多行尝试了类似的方法，但这没有用。

d3.csv("sample-data.csv", function(data){
  date = data.filter(function(row) {
      return row['YYYYMMDD'] == '20100901';
  })

  period = data.filter(function(row){
    for (var i = 1950; i < 2013; i++) {
      return row['YYYYMMDD'] == (i +"0901");
    } 
  });

  createVis();
}

问题 2：

根据用户输入（左/右键按下）我想更改过滤的日期和期间并更新一些 SVG。

示例：
当前日期为：20100903。用户点击右箭头键，日期更改为 YYYYMMDD 列中包含 20100904 的行，并且句点随之更改，就像我在问题 1 的 for 循环中一样。

我只是坚持这个，因为我不知道如何构建我的代码。

我的 csv 数据样本：

YYYYMMDD, DDVEC, FHVEC, FG  
20100901, 31, 51, 57
20100902, 245, 20, 51
20100903, 279, 51, 62
20100904, 220, 36, 46
20100905, 284, 26, 41

请注意，我的 csv 最终将包含更多数据。

在此先感谢您的帮助。

4

1 回答 1

3 
  period = data.filter(function(row){
    for (var i = 1950; i < 2013; i++) {
      return row['YYYYMMDD'] == (i +"0901");
    } 
  });

将没有机会迭代 i 的所有值，因为 return 语句将在第一次迭代时触发。为了保持您的结构基本完整，您可以进行一些小的修改：

  period = data.filter(function(row){
    for (var i = 1950; i < 2013; i++) {
      if (row['YYYYMMDD'] == (i +"0901")) { return true; }
    }
    return false; 
  });

只有匹配时才会返回 True；如果循环结束没有匹配 False 将被返回。

要改进结构，请简化您要检查的内容：

  period = data.filter(function(row){
    var dateNum = +row['YYYYMMDD'];
    return 19500901 <= dateNum && dateNum <= 20130901;
  });

在这里，您的字符串日期被转换为整数+并执行简单的算术运算（这不可能对字符串执行，因为它们使用字典比较）来检查日期是否在范围内。

理想情况下，您的日期应该用实际日期表示- 如果您的日期格式正确，一切都会容易得多。要将日期字符串转换为日期对象：

period.forEach(function(d){
  d.date = d3.format('%Y%m%d').parse(d.date);
})

要检查给定行的日期是否满足您指定的标准：

   row.date.getDate() == 1   && row.getMonth() == 8 
&& 1950 <= row.getFullYear() && row.getFullYear() <= 2012
于 2013-09-25T14:50:32.760 回答