Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable pan for d3.behavior.zoom?

Tags:

d3.js

This question looks quite similar to this one, but I am still not able to figure out whether it is possible to use d3.behavior.zoom but without the pan ability. In other words I just want to zoom-in/out using the wheel only.

The reason for this is that I want to be able to brush on the "zoomable" area.

Thanks!

like image 798
elachell Avatar asked Dec 04 '12 23:12

elachell


1 Answers

Say you've defined a zoom behavior:

var zoom = d3.behavior.zoom().on('zoom', update); 

When you apply the zoom behavior to a selection, you can unregister the event listeners that it uses internally to detect and respond to certain interactions. In your case, you'd want to do something like this:

selection.call(zoom)     .on("mousedown.zoom", null)     .on("touchstart.zoom", null)     .on("touchmove.zoom", null)     .on("touchend.zoom", null); 

I'm not sure you want to remove the touch events. Doing so might eliminate double tap zooming. You should experiment with those.

like image 85
seliopou Avatar answered Sep 23 '22 06:09

seliopou