javascript - NVD3 : Weird Behavior When Using Date as X-Axis Ticks

Question

我正在构建一个折线图，应在 x 轴上显示日期。该图表工作正常，只是日期刻度有点困惑。它跳过了一个日期!我在这里复制了这个问题:https://jsfiddle.net/Tanakrit/k0vr99fd/

在上面的示例中，您可以看到 x 轴上只有 7 个刻度，而它应该有 8 个。以 tickFormat 打印它们，我了解到似乎有两个3 月 25 日，这就是为什么它实际上只显示 7 个刻度。

让我失望的是我不确定 tickFormat 中的函数如何获取其 d 输入，因为它们看起来不像 x 我实际赋予图表的值。

Answer 1

你可以这样做:

var data_full = data();//get all  data
var secondDate = d3.max(data_full[0].values, function(d){ return new Date(d.x)});//get the max date
var firstDate = d3.min(data_full[0].values, function(d){return new Date(d.x)}); get min date
var between = [];
//get all dates between max and min date
while (firstDate <= secondDate) {
    between.push(new Date(firstDate));
    firstDate.setDate(firstDate.getDate() + 1);
}
chart.xAxis
    .axisLabel('Time (days)')
    .rotateLabels(-55)
        .tickValues(between)//set all dates manually with tickValues.
    .tickFormat(function(d) {
        return d3.time.format('%b %d')(new Date(d));
    })
    ;

工作代码here