D3 在 FF 和 Chrome 之间呈现不同的 xAxis Months

Question

我创建了一个简单的条形图，其中 yAxis 是任意编号，xAxis 是从 1 月 17 日到 1 月 18 日的时间刻度。出于某种奇怪的原因，Chrome 没有显示第一个月（1 月 17 日）。对于 Firefox，我有预期的结果。

我尝试使用 [utcMonth || 的组合。 timeMonth] 和 [utcFormat || monthFormat]。每个都有不同的结果。

我是否想念 chrome 和 firefox 之间的理解？

JS

  x = d3.scaleTime()
        .domain([new Date("2017-1-1"), new Date("2018-1-1")])
        .range([0, this.width - this.margin.left - this.margin.right - 40]);

  drawXAxis() {
   this.xAxis = this.g.append("g")
    .classed("bar-x-axis", true)
    .call(d3.axisBottom(this.x)
      .ticks(d3.utcMonth.every(1))
      .tickFormat(d3.utcFormat("%b-%y"))
  );
 }

CSS

.bar-x-axis text{
  text-anchor: middle;
}

.bar-x-axis path {
  display: none;
}

附件是两个浏览器的例子 注意：Chrome 不显示 Jan17

chrome ff

Answer 1

没关系，我认为这可能是一个潜在的错误

通过将 new Date("2017-1-1") 更改为 new Date(2017, 0, 1) 来修复它