使用时间序列条形图时，x轴上的标签错误

Question

我正在尝试渲染时间序列条形图宽度dc，crossfilter和d3。 JSON数据从1989年到2010年，看起来像这样：

[{
    year: 1999,
    events: 40
},{
    year: 1996,
    events: 25
},
...
]

为了呈现它，我有以下代码：

var volumeChart = dc.barChart("#yearly-chart");
var ndx = crossfilter(data);
var yearDim = ndx.dimension(function(d) {
  return d.year;
});

var countPerYear = yearDim.group().reduceSum(function(d) {return d.events;});

volumeChart
    .width(700)
    .height(200)
    .margins({top: 50, right: 50, bottom: 20, left: 40})
    .dimension(yearDim)
    .group(countPerYear2)
    .elasticY(true)
    .x(d3.time.scale().domain([1989, 2011]))

volumeChart.render()

这种作品，但是X轴上的年份标签奇怪地搞砸了：

如果我使用Date个对象确定x轴，如：

x(d3.time.scale().domain([new Date(1989, 1, 1), new Date(2010, 12, 31)]))

我在图表中没有数据，尽管看起来它应该是正确的方法。我做错了什么？

Answer 1

日期对象确实是可行的方法，但您需要将JSON中的日期解析为此类对象。因此，无论您何时加载数据，还要解析日期。