Javascript 将最小值添加到y域-D3时，直方图条消失

我曾经创建过一个带有可变宽度条的直方图。看起来还可以，但我的第一个x值点从1200开始，所以我想将最小域从0更改为最小x值

x.domain([0, d3.max(bins.map(function(d) { return d.offset + d.width; }))]);

我已将0替换为

d3.min（bins.map（函数（d）{return d.offset+d.width；}））

。尽管条形图消失，x轴仍按预期渲染。我甚至试图硬编码实际的min x值，但我得到了相同的结果

有什么想法吗？

---

谢谢

问题在于，该示例对钢筋的位置和宽度使用相同的比例。更改域时，位置会按预期移动，但宽度现在将为负值。这会抛出一个错误，而这些条根本不会被画出来

条码宽度的原始代码：

svg.selectAll(".bin")
  .data(bins)
.enter().append("rect")
  .attr("class", "bin")
  .attr("x", function(d) { return x(d.offset); })
  .attr("width", function(d) { return x(d.width) - 1; })
  .attr("y", function(d) { return y(d.height); })
  .attr("height", function(d) { return height - y(d.height); });

因为您的x域不再从零开始，所以您需要根据条形图左右边缘位置之间的差异来计算条形图的宽度：

  .attr("width", function(d) { 
         return x(d.width + d.offset) - x(d.offset) - 1; })

---

（最后的

-1

只是填充。）

你能发布完整的代码吗？谢谢！工作得很有魅力：）