Javascript D3带数组对象的条形图

下午好

我正在使用D3条形图示例和我的数据（格式与 jsfiddle示例）

图表运行良好，但我有一些我不知道我能解决的问题

xAxis具有关键参数的索引编号，而不是关键参数值

按下“排序”按钮后对数据进行排序时

排序后条上的数字消失或出现在左侧而不是相应条上

var数据集={key:[0,30]，value:[60,30]}


这里是一个链接，您可以在其中查看代码并执行更改

感谢
要引用键值，您必须使用它们而不是索引：

var xScale = d3.scale.ordinal()
    .domain(dataset.key)
    .rangeRoundBands([0, w], 0.05);
// ...
.attr("x", function(d, i) {
  return xScale(dataset.key[i]);
})

通过合并键数组和值数组，使它们都是同一数据元素的一部分，可以更好地实现这一点

至于另一个问题，这是因为您正在选择
text
元素，其中包括轴标签。即使使用“关键点”功能，这里也不起作用，因为其中一个轴标签与要在栏上显示的标签相同。为这些标签指定一个特殊类并相应地选择可解决此问题

有关完整的JSFIDLE，请参阅。
您可以更好地解释我如何合并键数组和值数组？在这之后，我调用数据的方式是一样的？再次感谢。数据看起来像
[{key:0，value:30}]
。然后将整个数据传递给
.data（）
，在计算坐标时，将
d.key
或
d.value
传递给标尺；我只能访问数据的d.value属性：我的数据是一个对象数组[{}]，不知道你在问什么，但最好把它放到一个单独的问题中。