javascript - 在d3 js中设置x时间轴的范围和域

Question

我对 d3 js 相当陌生，但我仍然在设置轴时遇到问题。我正在尝试为水平浮动条形图设置时间轴。我的代码看起来相对相同，除了 from 和 to 是 201808、201809 等（年和月）的小例外。

从下面链接的示例中编辑代码的jsfiddle 。更改在数据集中和：

var xAxis = d3.axisBottom(x)
      .tickFormat(d3.time.format("%Y%b"));

显然，这不是为轴分配时间的最聪明的方法，但我仍然遇到轴的域、范围和缩放问题。

Answer 1

您的主要问题是您不能混合d3v3 和 d3v4 API 调用

不是

var xAxis = d3.axisBottom(x)
      .tickFormat(d3.time.format("%Y%b"));

但

var xAxis = d3.svg.axis().scale(x).orient("bottom");
    // .tickFormat(d3.time.format("%Y%b"))

提示查看您的控制台并查看问题的可能原因为什么您看不到东西

要获得时间轴，您需要使用时间刻度，并且需要解析时间，但它们是数字，因此您可以使用

function NumberToDate(n) {
   return new Date(n/100, (n%100)-1, 1);
}

Julyy与一 (1) y。

May如何从未来回到过去

{"month": "May", "to": 201803, "from": 201812}