在 d3 图表中保持轴刻度之间的距离答案

【问题标题】：maintain distance between axis ticks in d3 chart在 d3 图表中保持轴刻度之间的距离
【发布时间】：2013-05-09 17:55:16
【问题描述】：

我正在尝试使用 d3-js 绘制图表。我希望 X 轴值为[0.25yrs; 0.50yrs; 1yr; 2yrs; 5 yrs; 10yrs; 15yrs; 20yrs; 30 yrs; 50 yrs]。这可以使用 d3 的 tickValues() 和 tickFormat() 函数来完成。但是我需要在 0.25、0.50 和 1 年的刻度之间保持一定的距离，因为大多数值都属于这些年份，它们之间的距离越大，绘制的圆圈的重叠就越少。

我需要的刻度位置是这样的：

您可以在上图中看到 0.01 和 .02 之间的距离。我们该怎么做？

【问题讨论】：

标签： javascript charts d3.js

【解决方案1】：

您需要实现一个自定义比例，将您的输入范围映射到这个非统一的输出范围。然后你可以把这个比例赋予你的轴，它会相应地绘制刻度。

如果有任何东西与您想要的足够接近（可能是对数刻度？），您可以查看 D3 提供的刻度，但如果找不到任何东西，您别无选择，只能实现自己的。

【讨论】：

谢谢拉尔斯。我会调查的。