Javascript D3 v4日期标记从不显示最后一项

我正在使用D3V4构建一个非常简单的图表。我用的是x轴的时间刻度。我知道D3在使用时间刻度时保持对显示的刻度数的控制。但这似乎不能解释这里的行为

代码笔（链接如下）显示了该行为的RTC。我有5个日期，非常简单地定义为

2018-10-10

，

2018-10-11

，等等。我使用的是

d3.scaleTime（）

和

d3.axisBottom（）

，没有什么特别之处

无论我做什么，最后的日期都不包括在勾号内。为什么会这样

---

在d3中使用时间刻度时存在某些挑战。这是工作代码。您可以相应地更新记号格式和高度/宽度-

var svg = d3.select('#graph')
  .attr('width', '400px')
  .attr('height', '200px')

var data = [
  new Date('2018-10-10'),
  new Date('2018-10-11'),
  new Date('2018-10-12'),
  new Date('2018-10-13'),
  new Date('2018-10-14')
]

var x = d3.scaleTime().range([50, 350])

x.domain(d3.extent(data))

svg.append('g')
  .attr('class', 'x-axis')
  .call(d3.axisBottom(x) .tickValues(data.map(function(d){return d}))
                .tickFormat(d3.timeFormat("%Y-%m-%d")));

---

在d3中使用时间刻度时存在一定的挑战。这是工作代码。您可以相应地更新记号格式和高度/宽度-

var svg = d3.select('#graph')
  .attr('width', '400px')
  .attr('height', '200px')

var data = [
  new Date('2018-10-10'),
  new Date('2018-10-11'),
  new Date('2018-10-12'),
  new Date('2018-10-13'),
  new Date('2018-10-14')
]

var x = d3.scaleTime().range([50, 350])

x.domain(d3.extent(data))

svg.append('g')
  .attr('class', 'x-axis')
  .call(d3.axisBottom(x) .tickValues(data.map(function(d){return d}))
                .tickFormat(d3.timeFormat("%Y-%m-%d")));

---

对我来说，第一个日期没有打印，原因时区，用UTC，解析，坐标轴…处理所有日期，对我来说，第一个日期没有打印，原因时区，用UTC，解析，坐标轴…处理所有日期，这是正确的。这似乎与

tickValues（）

调用有关。这是正确的。这似乎与

tickValues（）

调用有关。