在D3.js中取消注册缩放侦听器并恢复滚动功能

Question

我现在正在工作D3.js. 这是为我的svg标记注册缩放监听器的代码

var zoomListener = d3.behavior.zoom().scaleExtent([0.1, 3]).on("zoom", zoom);
function zoom() {
  vis.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
}
svg.call(zoomListener)

现在,当我在svg元素上滚动鼠标时,它会被缩放.但是当我解开像这样的缩放事件时

zoomListener.on("zoom", null);

只有svg没有缩放,但是当鼠标悬停在svg元素上时我无法滚动页面.

如何取消绑定缩放侦听器并恢复鼠标的滚动功能？谢谢!

Answer 1

要完全禁用缩放行为,您需要取消注册已在其调用的元素上安装的所有事件处理程序:

svg.on("mousedown.zoom", null);
svg.on("mousemove.zoom", null);
svg.on("dblclick.zoom", null);
svg.on("touchstart.zoom", null);
svg.on("wheel.zoom", null);
svg.on("mousewheel.zoom", null);
svg.on("MozMousePixelScroll.zoom", null);