D3线图,无法用序数量表编辑滴答数量？

Question

我之前问了一个关于d3的问题,他们建议我使用序数量表,这样可以解决我的问题.确实它解决了我的问题,但知道我已经陷入了另一个问题......

它画得很完美,但我的X轴充满了文字.举个例子,我想:1900 1904 1908 1912 ......但我得到了:190119021903190419051906.正如你所看到的那样,目前尚不清楚.(这只是一个例子,如果只有日期我可以使用另一个比例).我看到的每个地方都谈到了axis.ticks(数字).但这不起作用.什么都没发生,我仍然得到相同的结果.我破解了一个结果,以便在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循环(令人讨厌的黑客),我只有以下行定义x.domain:

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

Answer 1

查看轴的文档,特别是ticks()函数.您可以使用它(或tickValues())来控制要显示的值(和值).

如果您正在使用日期,则可能需要使用时间刻度而不是序数刻度.特别是它允许您以更有意义的方式控制刻度,例如,指定您希望每五年刻度一次.