Javascript 如何设置域以避免d3绘图中的点和轴重叠？

我试图在d3中创建一个简单的散点图（类似于下面的图）：

我使用

extent（）

设置标尺的输入域范围

xScale.domain(d3.extent(xvalues));

使用此方法会导致一些点与d3绘图中的轴重叠：

如何避免轴重叠并使边距与matplotlib的绘图相似

---

输入值各不相同，因此，

extent（）

输出的简单增量/减量看起来不像是一般的解决方案。

一般来说，处理这一问题的最佳方法是调用标尺的函数，该函数将标尺域的末端四舍五入为合适的值。在您的特定情况下，这不起作用，因为值已经“很好”

在本例中，我将计算域的范围，并将其扩展一小部分。例如：

var padding = (xScale.domain()[1] - xScale.domain()[0]) / 10;
xScale.domain([xScale.domain()[0] - padding, xScale.domain()[1] + padding]).nice();

---

在matplotlib图像中，点不重叠，x比例为负值

在d3中：

var xScale = d3.scale.linear()
             .domain([
                    d3.min(data, function(d) {
                      return d.val;
                     })-10, //so the domain is wider enough for the zero value

                     d3.max(data, function(d) {
                      return d.val;
                     }),
             ])
              .range([height , 0])

---

设置域后执行

xScale.nice（）

。@Larskothoff看不到任何区别。看起来nice（）试图得到最接近的舍入值，在我的例子中已经是0了。@Larskothoff我可能错过了一些东西。我在域设置之后尝试了

xScale.domain（…）.nice（）

，

xScale.nice（）

，并且

xScale=xScale.nice（）

，但运气不好。啊，对了。在这种情况下，D3没有内置任何东西，但很遗憾，你可以简单地将最小值和最大值乘以一个常数来扩展轴。啊，你发现我建议的一切都有问题；）您还可以计算从最小值到最大值的范围，取其中的10%，从最小值减去它，然后将其添加到最大值，然后

.nice（）

。您是否在

xScale（）[0]

中缺少

.domain（）

？是的，以及

.domain（）

的方括号。。。修好了！