Search code examples
javascriptd3.jsgraphzoomingdagre-d3

d3 zooming by click ctrl and mousewheel, disable browserzoom

i want to zoom a dagre-d3 graph by clicking ctrl and mousewheel. If i dont press ctrl i want that the browser scroll is active. When i want to pan the graph it should work without clicking ctrl. Is it possible? I have made a fiddle but it does not work.

var zoom = d3.behavior.zoom().on("zoom", function () {
if(ctrlPressed == true){
inner.attr("transform", "translate(" + d3.event.translate + ")" +
    "scale(" + d3.event.scale + ")");
    }
});
svg.call(zoom);

jsfiddle

Solution

  • Finally get it work. But the zoom is not like the normal d3 zoom behavior because it does not zoom to the center.

    see Code in fiddle

    Working fiddle