angularjs - 如何更改 d3.js 中的时间刻度步骤？

Question

无法在我的图表中进行 5 分钟。

这是我传递给 Angular Material Chart 指令的对象的一部分 这是我的 xAxis:

xAxis: {
  tickFormat: function(d) {
    return $filter('date')(new Date(d * 1000), 'HH:mm');
  },
  ticks: 5, // as I know 2,5,10
  showMaxMin: false
},

我的 X 时间尺度是 17:46/18:03 我一直在尝试更改不同的值，也一直在阅读 D3 Tips & Trick 但没有找到答案。

我想做一个5 分钟的步数，我的 X 刻度看起来像 18:00/18:05/18:10

Answer 1

var startDate = data[0].x;
var finishDate = data[data.length - 1].x; 
chart.xAxis.tickValues(d3.time.minutes(startDate, finishDate, 5));

本质上，它使用 d3.time.minutes 每 5 分钟生成一个带有时间戳的数组。然后将其传递给 tickValues。