Javascript 如何禁用 d3.behavior.zoom 的双击缩放？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11786023/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to disable double click zoom for d3.behavior.zoom?
提问by Brant Olsen
I do not want d3.behavior.zoomto add the ability to double click zoom on my graph. How can I disable this behavior?
我不希望d3.behavior.zoom添加在我的图形上双击缩放的功能。如何禁用此行为？
Here is a JSFiddlewith the unwanted behavior.
这是一个带有不需要的行为的JSFiddle。
I have tried the following without any luck.
我已经尝试了以下没有任何运气。
d3.behavior.zoom.dblclick = function() {};
回答by mbostock
You can disable the double-click behavior by removing the zoom behavior's dblclick event listener. Looking at your code, you've assigned the zoom behavior to the SVG element. So you could say:
您可以通过删除缩放行为的 dblclick 事件侦听器来禁用双击行为。查看您的代码，您已将缩放行为分配给 SVG 元素。所以你可以说：
d3.select("svg").on("dblclick.zoom", null);
Or, together with where you register the zoom behavior:
或者，连同您注册缩放行为的位置：
.call(d3.behavior.zoom().on("zoom", update)).on("dblclick.zoom", null)
You might also want to move the zoom behavior down to a G elementrather than putting it on the root SVG element; I'm not sure it will work correctly on the root SVG, since the SVG element doesn't support the transform attribute.
您可能还想将缩放行为向下移动到G 元素，而不是将其放在根 SVG 元素上；我不确定它是否能在根 SVG 上正常工作，因为 SVG 元素不支持transform 属性。
回答by AJ Hurst
It's easy to set up a proxy function. Store the default (target) event, and then register a proxy event instead. The proxy will then enable / disable the target event using whatever logic you need:
设置代理功能很容易。存储默认（目标）事件，然后注册代理事件。然后代理将使用您需要的任何逻辑启用/禁用目标事件：
svg.call(zoom);
var dblclickTarget = svg.on("dblclick.zoom");
var mouseScrollTarget = svg.on("mousewheel.zoom");
function eventProxy(fn){
return function(){
// Enable events if enableEvents=== true
if(enableEvents){
fn.apply(this, arguments)
}
}
};
svg.on("wheel.zoom", eventProxy(dblclickTarget))
.on("mousewheel.zoom", eventProxy(mouseScrollTarget));By applying the proxy pattern in this way, you can simply change the "enableEvents" variable to enable or disable the events.
通过以这种方式应用代理模式，您可以简单地更改“enableEvents”变量以启用或禁用事件。
