14

我之前问过一个关于 d3 的问题，他们建议我使用序数比例，这可以解决我的问题。确实它解决了我的问题，但知道我遇到了另一个问题......

它画得很完美，但我的 X 轴上满是文字。例如，我想要：1900 1904 1908 1912 ...但我得到了：190119021903190419051906。如您所见，这并不清楚。（这只是一个例子，如果只有日期，我可以使用另一个比例）。我所到之处，他们都在谈论axis.ticks(number)。但这不起作用。什么也没发生，我仍然得到相同的结果。我破解了一个结果以在 x 轴上获得更少的结果：

  var str = [];
  var i = 0;
  while(i < data.length) {
      str.push(data[i].age);
      i=i+8;
  }
  x.domain(str);

但如果我这样做，它会创建一条随机线并且不再完美地绘制它。不知道怎么解决..这是一个简单的折线图，没什么难的，唯一的困难（对我来说）是序数比例......

希望有人可以帮助我。

这就是我的 x 和 x 轴的定义方式：

var x = d3.scale.ordinal()
    .rangeRoundBands([0, width-150],1);

var xAxis = d3.svg.axis()
    .scale(x)
    .orient("bottom")

没有while循环（讨厌的hack），我只有以下行定义x.domain：

x.domain(data.map(function(d) { return d.age; }));
4

1 回答 1

7

查看axes 的文档，尤其是ticks()函数。您可以使用它（或tickValues()）来控制要显示多少（以及什么）值。

如果您使用日期，您可能希望使用时间尺度而不是序数。特别是，它将允许您以更有意义的方式控制刻度，例如指定您希望每五年进行一次刻度。

于 2013-04-15T13:02:25.400 回答