javascript - D3 时间和日期直方图

Question

我尝试主要使用时间和日期数据制作直方图，这些数据以以下格式在 json 文件(以及其他信息)中提供:2014-03-01 00:18:00。我看过http://bl.ocks.org/mbostock/3048450举个例子，但我还没有成功破解它。关键部分似乎是这样的:

    var data = d3.layout.histogram()
        .bins(x.ticks(20))
        (dataset.timestamp);

当我在浏览器中查看代码时，它给出“TypeError:数据未定义”，并引用 d3.v3.js 第 5878 行。

假设我修复了该错误，下一个可能出错的地方是轴格式:

    var formatDate = d3.time.format("%y-%m-%d %h:%m:%s");

    var xAxis = d3.svg.axis()
        .scale(x)
        .orient("bottom")
        .tickFormat(formatDate);

格式语法是否与我的时间和日期格式正确对应？

Answer 1

我认为直方图布局不接受非数字输入(我可能是错的)。一种选择是通过解析和使用 getTime() 将日期转换为自 1970 年以来的毫秒数:

var formatDate = d3.time.format("%Y-%m-%d %H:%M:%S");

var data = d3.layout.histogram()
    .bins(x.ticks(20))
    .value(function(d) {return formatDate.parse(d.timestamp).getTime()})
    (dataset);

您需要确保 x 刻度(如 x.ticks(20) 中)具有基于毫秒数据的域。