Search code examples
javascriptd3.jstreezoomingpan

D3js zoom does not work

I can not make zoom work. Tried everything.
My goal:

  • zoom on mouse scroll
  • drag the tree by a mouse

The code is here:

svg = d3.select("#tree-container")
        .append("svg").attr("width", width)
        .attr("height", height)
        .call(zm = d3.behavior.zoom().scaleExtent([1, 3]).on("zoom", redraw))
        .append("g")
        .attr("transform", "translate(" + 350 + "," + 20 + ")");

jsFiddle
P.S. sorry for spaggeti code

Solution

  • It's the declaration of your redraw function that causes the problem -- if you declare it as a function, it works fine:

    function redraw() {
  // etc
}

    Complete example here.