Expanded and Closed Groups

GoJS
1

A simple doubt, as it would be possible to indicate in the nodeDataArray[], if I want the group expanded or closed

example:

nodeDataArray: [
{“key”:1, “text”:“Node 1”, “isGroup”:true, “expanded”:“false”},
{“key”:2, “text”:“Node 2”, “isGroup”:true, “expanded”:“true”},
]

image

2

Bind the isSubGraphExpanded property on the Group. See, for example, Swim Lanes

new go.Binding("isSubGraphExpanded", "expanded").makeTwoWay(),
1 Like
3

Hello, thank you very much for your answer.
I have a problem, the nodes that are inside the “expanded: false” group are not shown when I open the group.

4

That is certainly not the default behavior, as you can see in the Regrouping sample. What changes have you made to the group template?

5

This is my group template

myDiagram.groupTemplateMap.add(‘grupo_panel_tree’,
GO(go.Group, “Auto”,
{
ungroupable: true,
mouseDragEnter: function(e, grp, prev) { highlightGroup(e, grp, true); },
mouseDragLeave: function(e, grp, next) { highlightGroup(e, grp, false); },
computesBoundsAfterDrag: true,
mouseDrop: finishDrop,
handlesDragDropForMembers: true,
layout: layoutTree
},
new go.Binding(“location”, “loc”).makeTwoWay(),
new go.Binding(“isSubGraphExpanded”, “expanded”).makeTwoWay(),
GO(go.Shape, “Rectangle”, { fill: null, stroke: “gray” }, new go.Binding(‘fill’,‘color’)),
GO(go.Panel, “Table”, { margin: 0.5 },
GO(go.RowColumnDefinition, { row: 0, background: “white” }),
GO(“SubGraphExpanderButton”, { row: 0, column: 0, margin: 3 }),
GO(go.TextBlock, { margin: 5, editable: false , row: 0, column: 1, font: “bold 13px Sans-Serif”, stroke: “black”, textAlign: “left”, stretch: go.GraphObject.Horizontal } ,
new go.Binding(“text”)
),
GO(go.Placeholder, { row: 1, columnSpan: 2, padding: 50, alignment: go.Spot.TopLeft },
new go.Binding(“padding”, “isSubGraphExpanded”,
function(exp) {
return exp ? 25 : 10;
}
).ofObject()
)
)
));

image
image.png781×521 15.4 KB

6

What is layoutTree?

7

layoutTree = GO(go.Layout, { });

8

That should be the same as not setting the Group.layout property at all. I just tried modifying the samples/regrouping.html sample by adding:

  { . . .,
    isSubGraphExpanded: false,
    layout: $(go.Layout, {})
  },
  new go.Binding("isSubGraphExpanded", "expanded").makeTwoWay(),

to both group templates, and everything worked as I believe you would expect.

So I cannot explain why you are getting that behavior. Could you please tell us how to reproduce the problem?

Oh, I noticed that the value in your JSON for “expanded” should be false or true – a boolean value, not a string. However that does not explain your problem.