CODEWITHSUNDEEP
javascripthtmlcssd3.jssvg
Manish Agrawal
Manish Agrawal

Reputation: 794

D3 Collapsible tree: Scrollable container for tree

I am using D3 collapsible tree. And its size increase dynamically. Can I use a div tag and its class to make it scrollable? So that when size of tree increase it can be scrollable.

http://jsfiddle.net/bSQ8U/159/ is the problem example. Here when I expand all nodes. I will not be able to see full tree.

Upvotes: 1

Views: 1863

Answers (1)

Cyril Cherian
Cyril Cherian

Reputation: 32327

You can set the height of the svg as it exapnds/collapses.

  window.setTimeout(function() {
    var max = d3.max(d3.selectAll(".node")[0], function(g) {
      return d3.transform(d3.select(g).attr("transform")).translate[1];
    });
    //set the max of the group
    d3.select("svg").attr("height", max + 100)
    console.log(max)
  }, 800)//execute after 800 milliseconds after the update.

working code here

Hope this helps!

Upvotes: 4

Related Questions