遍历D3中所有数据点之间的所有值

Going through all values between all points of data in D3

本文关键字：之间 数据 D3 遍历      更新时间：2023-09-26

我有数据。比方说：

date,comments
19-Apr-2016,Today was great.
21-Apr-2016,Today was not so great.
1-May-2016,Interesting things happened!

（所有日期都被解析为日期）

我想浏览2016年4月19日至2016年5月1日的每一天，为每一天制作一个元素，然后在存在的地方注入相关数据。例如：

19-Apr-2016 - Today was great.
20-Apr-2016 - <No entry>
21-Apr-2016 - Today was not so great.
22-Apr-2016 - <No entry>
...
1-May-2016 - Interesting things happened!

这是当前代码。它执行前者，并为每个数据点创建一个元素：

preview.selectAll("svg")
    .append("g")
    .data(sums)
    .enter()
    .append("rect")
    // Drawing code etc. Setting height, class, color, w/e

无论是否有数据，我如何在所有日子里循环？

下面是我将如何处理这个问题的伪代码。

假设你的sums对象是一个数组，它存储你表示的数据

19-Apr-2016 - Today was great. 20-Apr-2016 - <No entry> 21-Apr-2016 - Today was not so great. 22-Apr-2016 - <No entry> ... 1-May-2016 - Interesting things happened!

现在，在我绘图的功能中，我会喜欢这个

var start = new Date(2016, 3, 19);//19-Apr-2016
var end = new Date(2016, 4, 1);//1-May-2016
for (var d = start; d <= end; d.setDate(d.getDate() + 1)) {
  //for each date append a group
  var grp = preview.selectAll("svg").append("g")
  var myData = //get the data from sums array for which the date is d(in iterator)
  if(myData){
    grp.append("rect").style("stroke", 1) ...
  }else {
   //date not in the sums array.
  }
}

希望这能有所帮助！

D3的内置nest可能是实现这一点的最简单方法。

不要直接绑定sums。首先用nest按日期对数据进行分组，然后根据该分组绘制图表。

相关文章：