d3.js 替代axis.tickSubdivide？

Question

我想在 D3 的轴上绘制 subtick。
但在最新的 D3 中似乎不可能。

有axis.tickSubdivide() 函数来绘制subtick，但我认为这已被弃用。( https://github.com/mbostock/d3/commit/bd0ce6cab8a2b0d2aaffc7ce21a873fc514eb8ed )

而且axis.tickSubdivide() 不再在API( https://github.com/mbostock/d3/wiki/API-Reference ) 上。

我试过axis.innerTickSize，但没有用。

有什么方法可以在我的处理轴上绘制 subtick 吗？

我找到了一个使用axis.tickSubdivide()的例子(http://bl.ocks.org/GerHobbelt/3605124)，但我无法弄清楚它是如何工作的，即使嵌入的d3.v3.min.js说“n.tickSubdivide=function(){return arguments .length&&n}"，它什么也不做，只返回轴。

Answer 1

执行此操作的新方法是使用多个轴，一个用于主要刻度，另一个用于次要刻度。您可以为次要的选择也出现在主轴上的刻度并将它们删除:

svg.append("g")
  .attr("class", "grid")
  .attr("transform", "translate(0," + height + ")")
  .call(d3.svg.axis().scale(x).ticks(20).tickSize(-height))
  .selectAll(".tick")
  .data(x.ticks(10), function(d) { return d; })
  .exit()
  .classed("minor", true);

svg.append("g")
  .attr("class", "axis")
  .attr("transform", "translate(0," + height + ")")
  .call(d3.svg.axis().scale(x).ticks(10));

完整示例 here .