Comment désactiver le double clic zoom pour d3.comportement.zoom?
Je ne veux pas d3.comportement.zoom pour ajouter la possibilité de double-cliquer zoom sur mon graphe. Comment puis-je désactiver ce comportement?
voici un JSFiddle avec le comportement indésirable.
j'ai essayé ce qui suit sans aucune chance.
d3.behavior.zoom.dblclick = function() {};
2 réponses
vous pouvez désactiver le comportement de double-clic en supprimant l'écouteur d'événements dblclick du comportement de zoom. En regardant votre code, vous avez assigné le comportement de zoom à L'élément SVG. Pour que tu puisses dire:
d3.select("svg").on("dblclick.zoom", null);
ou, avec l'endroit où vous enregistrez le comportement de zoom:
.call(d3.behavior.zoom().on("zoom", update)).on("dblclick.zoom", null)
vous pourriez également vouloir déplacer le comportement de zoom vers le bas à un élément G plutôt que de le mettre sur L'élément SVG racine; Je ne suis pas bien sûr, cela fonctionnera correctement sur le SVG racine, puisque L'élément SVG ne supporte pas l'attribut transform .
il est facile de configurer une fonction de proxy. Enregistrez l'événement par défaut (cible), puis enregistrez un événement proxy à la place. Le proxy activera / désactivera alors l'événement cible en utilisant la logique dont vous avez besoin:
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));
en appliquant le modèle de procuration de cette façon, vous pouvez simplement changer la variable" enablevents " pour activer ou désactiver les événements.