散点图实现的固定轴

Fixing axis of a scatter plot implementation

本文关键字：实现 散点图      更新时间：2023-09-26

我正在使用d3来构建一些散点图。由于某种原因，我无法为我的情节获得合适的 X 轴 - 轴总是有一些重叠的文本。此外，这些点似乎与轴重叠。我怎样才能解决这个问题看起来更好？

我已经尝试了jsfiddle。有什么建议吗？

您可以使用 axis.ticks 来减少刻度的数量; xAxis.ticks(5)在这里似乎运作良好。

要阻止点与轴重叠，您有几个选项。一个是你可以增加tickSize或tickPadding。圆圈仍将与刻度线重叠，但不会与刻度线标签重叠。另一种选择是您可以增加域以强制在圆和轴之间留出额外的空间。

通常，您可以使用 d3.extent（或仅使用 d3.min 和 d3.max）自动计算域。下面是如何在每端将域扩展 10% 的示例：

// First set the domain automatically from the data.
var x = d3.scale.linear().domain(d3.extent(numbers));
// Then extend the domain using invert (with the default range [0, 1]).
x.domain([-.1, 1.1].map(x.invert));
// Lastly set the desired range.
x.range([0, width]);

在您的情况下，由于您正在对域进行硬编码，因此您可以将硬编码的内容更改为更广泛的值。

相关文章：