Question

我有a simple D3 scatterplot我在显示数据的几个不同属性之间切换，但我可以让数据点改变（并按我希望的那样转换），并且可以将标签更改为图的轴，我无法让轴自己更新（更不用说过渡）了。

我怀疑我在错误的顺序做某事，或者错过了一步，但我无法从文档或示例中弄清楚我正在从我缺少的东西中找到工作。

如何让我的轴与我的数据一起更新？

这个谜团来自链接代码末尾的行为：

d3.select("#distancefig").on("click", function () {
    d3.event.preventDefault();
    updatePlot('distancefig', false);
});
d3.select("#speedfig").on("click", function () {
    d3.event.preventDefault();
    updatePlot('speedfig', false);
});
d3.select("#distspeedfig").on("click", function () {
    d3.event.preventDefault();
    updatePlot('distspeedfig', false);
});

updatePlot('distancefig', true);

这里最后的显式updatePlot按预期更新所有内容（并且更改参数会更改所有内容 - 轴，标签，点 - 应该如此），但通过单击链接调用的调用仅更改数据点和标签;他们不更新轴。

Answer 1

我不熟悉你的代码结构，但我基本上把数据库中发生的一切都放在d3.csv回调函数中，所以关于文本功能的最后部分会有使用更新的域更新x和y轴，如：

d3.csv{
//select the text then add the onclick event
.on("click" function () {
x.domain(d3.extent(dataset, function (d) { return /* your updated value here */); })).nice();
//select the x-axis and then add this:
        .transition()
        .duration(1500)
        .call(xAxis);
//then do the same for the y axis
};}

关键步骤是确保select the axes correctly。

Answer 2

在每个点击处理程序中，您正在传递＆＃34; false＆＃34;作为第二个论点。在最后一个声明中，您正在传递＆＃34; true＆＃34;。这可能是原因吗？

为什么我的D3 SVG图上的轴不会更新？

2 个答案: