javascript - D3.js：序数轴的第一部分添加了2次

Question

我做了一个规模：

d3.scale.ordinal()
  .domain(monthds)
  .rangeRoundBands([0, w]);

然后制作sAxis并将其添加到svg：

svg.append("g")
   .attr("class", "axis")
   .attr("transform", "translate(0," + (h - padding) + ")")
   .call(xAxis);

但由于某种原因，前两个月被抽了两次。这是 jsbin 的链接：http: //jsbin.com/uyitis/22/edit

Answer 1

正如斯蒂芬评论的那样，它看起来不错。我已经碰撞了jsbin以稍微整理一下轴。x 轴有点悬在一边，所以我通过添加填充向右移动，如下所示：

//Create X axis
            svg.append("g")
                .attr("class", "axis")
                .attr("transform", "translate("+ padding + "," + (h - padding) + ")")
                .call(xAxis);

还必须使用填充更新日期比例范围，以防止 Oct 丢失，如下所示：

var xDateScale = d3.scale.ordinal()
                               .domain(monthds)
                               .rangeRoundBands([0, w-padding]);