d3.js:can'；不能让填充物在RangeRoundBand上工作？

我试图在条形图之间画一个带填充的条形图，但是我无法让

rangeRoundBands

插入填充，所以我做错了什么

这是我的代码：

var x0 = d3.scale.ordinal()
 .rangeRoundBands([margin.left, width], 0.1, 0.1);

... 

ap_bars.transition().duration(1000)
  .attr("x", function(d, i) {
    return i * x0.rangeBand();
  })
  .attr("width", x0.rangeBand());

但所有的铁条都堆在一起了

---

JSFiddle here:

您正在使用正确的填充来更改标注栏的大小，但是绘制这些条的方式也会将它们并排放置在一起。当你增加填充物时，你会发现这些条变得越来越细，但却保持在一起

您不需要使用基于数据索引的常量（

i*x0.rangeBand（）

），而需要基于缩放数据定位条形图：（

x0（d）

）。您可能需要调整条的位置，以便条的中心是每个条带的中心：（

x0（d）-x0.rangeBand（）*0.5

）