Question

我正在使用d3 JS库来绘制一些图表。它工作正常，但我遇到了一个奇怪的问题，我已经苦苦挣扎了一个小时 - 我无法设置x轴值。这是图表（我添加了一个警告，将显示数据格式）：

http://jovansfreelance.com/bikestats/d3/tipsy.php

我希望x轴显示年份，但由于某些原因我无法在代码中看到任何地方，而是使用十进制值代替，所以而不是2006年它有.006 - 我不知道这是哪里即将到来的形式，就像它取出第一个数字并将其余部分除以100？！

如果有人可以指出我正在执行此操作的代码行，那就没关系了，我可以从那里接受它。

Answer 1

正如另一个答案所指出的，处理时间值的更好方法是明确使用时间尺度。但是，要实现您想要的功能，只需明确指定x轴的格式即可。那就是

var xAxis = d3.svg.axis()
        .scale(x)
        .tickSize(h - margin * 2)
        .tickPadding(10)
        .ticks(7)

添加

.tickFormat(d3.format("d"));

Answer 2

可能与此parseDate = d3.time.format("%Y") not working

有关

如果是这样，您可能需要

d3.svg.axis()
   .scale(x)
   .tickSize(h - margin * 2).tickPadding(10).ticks(7)
   .tickFormat(function(d) { return d.toString(); }); // force the date value into a string

或者，如果您需要解析日期

   .tickFormat(function(d) { 
      var fmt = d3.time.format("%Y"); 
      return format.parse(d).toString() 
    });

如何在d3 Javascript图中设置x轴值？

2 个答案: