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() {};
36
demandé sur Brant Olsen 2012-08-03 01:25:02

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 .

87
répondu mbostock 2012-08-03 15:27:46

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.

3
répondu AJ Hurst 2014-11-03 11:03:04