D3毫秒刻度间隔问题

Question

var xAxis = d3.svg.axis()
      .scale(timeScale)
      .orient('bottom')
      .ticks(d3.time.millisecond, 100)
      .tickSize(-h + theTopPad + 20, 0, 0)
      .tickFormat(d3.time.format('%S:%L'));

1. 我的数据范围是0-3000毫秒。上面的代码将它显示为00:100、00:200、00:300；这是非常混乱的，因为大多数预期数据都在1000 as以下。 我正在寻找类似'100,200，....900,1000,1100‘的东西，也就是说，没有重叠的’秒‘。 如果这是不可能的，那么下一个最好的选择是'0:100，0:200，0:300……1:100‘，也就是说，没有秒的领先0。 这些都有可能吗？
2. 更重要的是，蜱的间距似乎被“100 to”粘住了。如果我将它更改为.ticks(d3.time.millisecond, 50)或其他任何东西，这并没有什么区别。窃听器？

编辑:我得到了first问题的答案。只需使用：

var tickformatter = d3.format("f")

.tickFormat(function(d) { return  tickformatter(d) + "ms"; });

小提琴： http://jsfiddle.net/Q5Jag/613/

Answer 1

您不需要使用d3.time.format。

在小提琴里，替换

d3.time.format('%Lms')

使用

function(d) { return d.getTime()+"ms"; }

由于没有d3.time.millisecond，所以您的蜱被卡住了100 is，因此它回到了默认的位置:10个滴答。您可以使用您的时间刻度的差异，并除以50，这是您想直接传递到axis.ticks()的蜱数。

Answer 2

在代码中替换下面的代码

var xAxis = d3.svg.axis()
      .scale(timeScale)
      .orient('bottom')
      .ticks(d3.time.millisecond, 50)
      .tickSize(-h + theTopPad + 20, 0, 0)
    .tickFormat(d3.time.format('%S:%L'));

而不是

var xAxis = d3.svg.axis()
      .scale(timeScale)
      .orient('bottom')
      .ticks(d3.time.millisecond, 50)
      .tickSize(-h + theTopPad + 20, 0, 0)
      .tickFormat(d3.time.format('%Lms'));