只有当鼠标悬停在散点图中的点上时，缩放才有效

Question

我正试图用D3实现一个具有缩放功能的散点图。我已经生成了绘图和可视化，只有当鼠标光标位于数据点上时，它才能放大和缩小。换句话说，当鼠标位于点以外的任何位置时，我都无法缩放。

我一直在网上搜索和尝试一些例子，但我没有运气。请检查此链接中的代码：https://github.com/e-kaya/scatter.git你认为我做错了什么？

提前谢谢。

Answer 1

您正在调用.dots上的缩放函数。

svg.select(".dots").call(zoom);

尝试将缩放函数绑定到<svg>。

d3.select('svg').call(zoom);

根据您的要求，您可能还需要调整缩放功能。

function zoomed() {
    d3.select('svg).attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
}

这将缩放你的svg容器。