Javascript 如何通过d3 zoomBehavior检测用户的平移和缩放？

我正在使用d3.zoomBehavior在地图上启用平移和缩放。它很好用。我还编写了代码，将地图重新居中放置在一个关注的项目上，这也是可行的。如果用户手动缩放或平移，我希望禁用此“自动重新居中”（检查地图控件是否“脏”）

当用户手动移动地图时，如何访问事件

我已尝试访问“拖动”、“滚轮”和“缩放”事件：

d3.select("svg").call(this.zoomBehavior).on("wheel", () => {
  console.log("user has zoomed with wheel"); // never gets called
}).on("drag", () => {
  console.log("user has panned map"); // never gets called
}).on("zoom", () => {
  console.log("zoom event"); // gets called even when the map is autofocusing -- not what I need.
});

---

选择中的哪些事件可以用来确定用户何时操作缩放和平移？

在缩放功能中，检查是否定义了

d3.event.sourceEvent

。

selection.call（zoom.transform，someZoomTransform）

触发的缩放具有null的sourceEvent。另外，

sourceEvent.type

可以提供有关事件类型的附加信息（例如：wheel、mousemove）

这是博斯托克的研究中使用的方法。手动拖动触发缩放的编程更新，手动缩放触发笔刷的编程更新：示例需要检测手动与编程缩放/笔刷的区别，以避免无限循环

下面，编程缩放应用于svg（包括代码段预览窗口），但您也可以平移/缩放。通过检查sourceEvent是否为null，我们可以查看缩放是由用户启动的还是以编程方式启动的：

var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，600）
.attr（“高度”，500）；
var zoom=d3.zoom（）
.on（“缩放”，函数（）{
if（d3.event.sourceEvent）{
console.log（“非编程缩放”）；
}
否则{
console.log（“编程缩放”）；
}
})
调用（缩放）；
调用（zoom.transform，d3.zoomIdentity）