Query on editable org chart

Need some info please.
I need to create a button with a text box .it should search the tree and display from that tree alone…
Rest all should be collapsed or hidden.
Is there any functionality exists,that can be used…or I need to try some logic implementation?


Have you seen the Org Chart sample, http://gojs.net/latest/samples/orgchartstatic.html ? It demonstrates searching the whole diagram.

To hide the rest of the diagram, which sounds as if it does not depend on the results of the search, I suggest you iterate over all of the Diagram.nodes and set each Node.visible if it is in the subtree of the selected node.

Something like:

    var selected = myDiagram.selection.first();
    if (selected == null) return;
    var subtree = selected.findTreeParts();
    myDiagram.nodes.each(function(n) {
        n.visible = subtree.contains(n);
    myDiagram.commitTransaction("hid rest of tree outside of selected subtree");

Thanks Walter!!

I have introduces a selective collapse and also a textbox input for parent key to fetch a particular Tree for the parent.

One more query.

How can know that " How many sub level existing for those visible nodes after this hiding the rest."

Also how can i get the total number of levels for a tree structure.

I have modified my answer above to be clearer and faster.

Most of what you need is available on the Node class, http://gojs.net/latest/api/symbols/Node.html.

Maybe you want to call http://gojs.net/latest/api/symbols/Node.html#collapseTree – it takes an argument that specifies how many levels to leave visible.

Although you can call http://gojs.net/latest/api/symbols/Node.html#findTreeLevel to find out the depth of a node in its tree, there is no efficient way to find the “deepest” level node. You should write that yourself, recursively walking the tree while keeping track of the levels.

Thank for the suggestions.

Need one more info . Is there any open source available for the Gojs plugin ?.

GoJS itself is not open source.