javascript - D3 trim hierarchical data by depth? -
i'm using d3 pack layout , data large.
so problem data large rendered smoothly. want trim data it's depth i'm totally @ loss how that.
the thing can think of write recursive function trim whole data @ each fresh.
[psudo] trim = function(node, depth){ if ( depth == 0 ) return null; foreach(node.child) node.child = trim(node.child, depth - 1); } but think there must ways handle here:
vis.selectall("circle") .data(nodes) .enter().append("svg:circle") .attr("class", ...)
here example of similar case: http://bl.ocks.org/mbostock/4339083
the dataset not large, treatment similar approach. when hierarchical data first loaded, modified collapsing descendants of root. here root left open. in case choose leave additional levels open initially. see recursive collapse function below:
d3.json("/d/4063550/flare.json", function(error, flare) { root = flare; root.x0 = height / 2; root.y0 = 0; function collapse(d) { if (d.children) { d._children = d.children; d._children.foreach(collapse); d.children = null; } } root.children.foreach(collapse); update(root); }); then later, user drills down (here in response node click, in case maybe in response else) each node adjusted accordingly:
// toggle children on click. function click(d) { if (d.children) { d._children = d.children; d.children = null; } else { d.children = d._children; d._children = null; } update(d); } all hide children whatever hierarchical layout apply. update function redraws hierarchy if hidden levels don't exist.
Comments
Post a Comment