Collapse and expand on org chart

GoJS
#1

Hi Team,

I am utilizing org chart layout for my requirement, as the data is in large chart taking lot space by default and can’t understand where started and where ended, If I can apply collapse and expand on parent node which have child nodes solves my problem. collapse and expand need only from 2, 3,4…level nodes

Kindly help us. We are already purchased gojs license

#2

Here’s what I would do to make sure that at most three levels of the tree are shown initially:

myDiagram.model = ...
myDiagram.findTreeRoots().each(root => root.collapseTree(3));

https://gojs.net/latest/api/symbols/Node.html#collapseTree
https://gojs.net/latest/api/symbols/Diagram.html#findTreeRoots

#3

Thanks,

to expand node I used below code but nothing happening. please advice
myDiagram.nodeTemplate =
(go.Node, "Auto", { locationSpot: go.Spot.Top, isShadowed: true, shadowBlur: 1, shadowOffset: new go.Point(0, 1), shadowColor: "rgba(0, 0, 0, .14)", selectionAdornmentTemplate: // selection adornment to match shape of nodes (go.Adornment, “Auto”,
(go.Shape, "RoundedRectangle", roundedRectangleParams, { fill: null, stroke: "#7986cb", strokeWidth: 3 } ), (go.Placeholder)
) // end Adornment
},
$(“TreeExpanderButton”,
{
name: ‘TREEBUTTON’,
width: 20, height: 20,
alignment: go.Spot.TopRight,
alignmentFocus: go.Spot.Center,
// customize the expander behavior to
// create children if the node has never been expanded
click: function(e, obj) { // OBJ is the Button
obj.visible = false;
var node = obj.part; // get the Node containing this Button
if (node === null) return;
e.handled = true;
expandNode(node);
}
}
)

#4

How is expandNode defined? What happens when you step through the code?