javascript - 如果两个刻度具有相同的值，d3 轴不显示刻度标签

Question

我已经修改了示例 d3.js yaxis 中的数据结构，没有将所有刻度正确绘制到

       [{name: "john",value: 4500},
        {name: "peter",value: 3000},
        {name: "tom",value: 2500},
        {name: "john",value:2000}];

绘制图表时，第四个名字，即 2nd john 没有出现在图表中，为什么会出现这种行为以及如何让它出现在图表中

这是它的乐趣http://jsfiddle.net/hyder/pFEEW/

Answer 1

如果仔细观察，您会发现第一项和第四项的条形图绘制在相同的位置并重叠。

根本问题是代码使用数据本身（重复）来识别单个元素。如果您希望不同的元素具有相同的数据值，则需要为它们提供唯一标识符，以便代码能够区分它们。代码中的刻度设置为相同的输入值将映射到相同的输出值，即如果您有相同的名称，则将在相同位置绘制条形图。

解决此问题的一种方法是使用唯一 ID 作为比例函数的输入，然后使用格式化程序从该 ID 制作标签。