javascript - 如何在域中显示重复值

Question

我正在尝试根据即将到来的值创建一个条形图，它应该按原样显示所有标签。条形图本质上是分组的。

我能够创建其中的大部分内容，但不知何故值(value)标签无法正常出现。

["July 02,2017", "July 09,2017", "July 02,2017", "July 12,2017"]

目前 scale.ordinal 正在删除重复值并使比例设置如下:

["July 02,2017", "July 09,2017", "July 12,2017"] 

这会扰乱图 TableView 。

如何在 x 轴上显示重复值？

JsFiddle

Answer 1

D3使用了domain的数学概念和 image对于尺度的域和范围。因此，域值应该唯一。

在您的情况下，解决方法是在数据数组中创建另一个属性，如下所示，它使用每个对象的索引创建一个名为 index 的属性:

data.forEach(function(d, i) {
    d.index = i
})

然后，将该属性(具有唯一 值)用于您的 x 刻度域。

此外，您还必须更改 x 刻度的刻度，您可以使用 tickFormat 来完成:

.tickFormat(function(d, i) {
    return data[i].Groups
});

这是更新后的 fiddle :http://jsfiddle.net/wujtnomh/