D3直方图 - 基于日期

Question

我有一个日期数组

["01/01/2001", "01/01/2001", "03/01/2001", "01/04/2001", "01/05/2001", "02/05/2001", "01/07/2001", "01/07/2001", "01/07/2001", "01/10/2001"]

有些是重复的，而且没有特定的顺序，在不同的时间范围内（1周、43天、2年等）。

我想做的是生成一个直方图（或条形图），显示任意数量的“日期”计数桶（如20个桶）。

如果一个桶中没有日期，则显示零，并显示包含日期的那些桶的总计。

基本上就像这个例子： http://bl.ocks.org/mbostock/3048450

但是我需要的不是随机的“秒”，而是“日期”。

例如：

我想要将X轴的范围改为我的数据中的日期范围。

- ukmikeb

---

你尝试过什么？这是一个非常模糊的问题 - 请更新具体的问题，你正在努力解决哪些方面。 - Lars Kotthoff

具体来说，我需要在这个例子（http://bl.ocks.org/mbostock/3048450）中做哪些改变，才能接受一个“日期”数组而不是“分钟”？ - ukmikeb

听起来你只需要更改x轴刻度的格式化程序，将其转换为日期，解析它，然后按照你想要的格式进行格式化即可。 - Lars Kotthoff

Answer 1

因此，像@LarsKotthoff在评论中提出的那样，这个问题的解决方案是。

var x = d3.time.scale().domain([firstDate, lastDate]).range([0, width]);

var data = d3.layout.histogram()
        .bins(x.ticks(bins))  
        (values);

var formatDate = d3.time.format("%d/%m/%y");
var xAxis = d3.svg.axis()
            .scale(x)
            .orient("bottom")
            .tickFormat(formatDate);

- ukmikeb

---

请您复制您用来解决这个问题的完整代码吗？在生成直方图之前，您之前定义了哪些变量并不是很清楚。谢谢！ - aboutaaron

我发现计算条形图的宽度有点奇怪，因为在直方图布局生成的数据数组中，x 值是一个日期，但 dx 值是毫秒数。对于条形的宽度，我使用了以下公式：x(new Date(data[0].x.getTime() + data[0].dx))。 - npdoty

这段代码不完整。你是如何计算箱子的？ - Liviu