D3.js: Expand tree till node n

Question

I am right now creating an Org Chart using a D3.js Tree layout. The Organization chart will be opened by a logged in user and the requirement is to show the org chart opened to the user's node by default.

For example, if the logged in user is 'n', and the org chart is :

        j   m
       /   /
  b - e - k
 /
a - d - l - n
 \
  c- f - h
      \ 
       i

The user will see :

a - d - l - n

So, the problem statement is to expand the Org chart till a particular node where the node id/name is the logged in user.

Any help is welcome.

Have you heard about DFS or BFS? http://stackoverflow.com/questions/3332947/when-is-it-practical-to-use-dfs-vs-bfs — 0x90, May 04 '16 at 11:20

score 6 · Accepted Answer · answered May 04 '16 at 12:05

First set the parent object in each data object:

  function collapse(d) {
    if (d.children) {
      d._children = d.children;
      //set the parent object in all the children
      d._children.forEach(function(d1){d1.parent = d; collapse(d1);});
      d.children = null;
    }
  }

Write a find function which finds the node and opens all its parents.

function find(d, name) {
    if (d.name == name){
      while(d.parent){
        d = d.parent;
        click(d);//if found open its parent
      }
      return;
    }

    //recursively call find function on its children
    if (d.children) {
      d.children.forEach(function(d){find(d, name)});
    } else if(d._children){
      d._children.forEach(function(d){find(d, name)});
    }
  }

Now call the find function with the node you wish to see

  var name = "layout";//example open till you find the node layout
  find (root, name)

working code here

D3.js: Expand tree till node n

1 Answers1