Temporary usage of AutoLayout

Basically my application does not use auto layout.
Yet, there are some use cases in my application where i need to use auto layout but immediately return to NON auto layout.
I have tried to diagram “LayoutCompleted” lister and in this listener i call the layout.isOngoing = false;
So, when i call the auto layout by setting the diagram.layout, the auto layout does occur and at the end of it GOJS call the LayoutCompleted listener, but this method affects other GOJS functionality such as when hiding/showing the diagram div.
The diagram does not refresh since it is isOnGoing=false.
So, i can use auto layout and as soon as layout completed, return to “NO” layout state .

First, understand that you don’t have to set Diagram.layout at all, if you don’t want to.

But there are advantages in having the Diagram.layout be some Layout that you assign. You can set its Layout.isInitial to false and Layout.isOngoing to false, so that the layout never happens automatically. Whenever you want to explicitly perform a layout, call Diagram.layoutDiagram(true).

Read more at GoJS Layouts -- Northwoods Software.

This is understood,
But i have two cases in my application that i need to use GridLayout and ForcDirectedLayout.
So, every time i want them to work, i set the diagram.layout to the desired Layout and as soon as the layout is completed i want to return to regular Layout(), namely no layout (because the user might move nodes on the map and so i don’t want to auto layout to work at this stage)
I don’t know how to switch back to NO Layout.

myDiagram.layout = new go.Layout();

If i do :

myDiagram.layout = new go.GridLayout();
myDiagram.layout = new go.Layout();

Will it run the Grid auto layout and after finishing the layout it will return to “NO” layout ?
This is what i did in first place but i wasn’t sure it is working.
If so, this is the best solution for me, i don’t have to implement listener and other stuff.

Maybe this would work:

myDiagram.layout = new go.GridLayout();
myDiagram.layout = new go.Layout();

It works fine, yet it does not work when executed from subGraphExpandedChanged handler, namely, when i collapse two groups one after each other, i expect the GridLayout() to move the group aside so that the group content (nodes) will not overlap each other.

OK, forget about all that – it sounds as if you do want to use automatic layouts most of the time.

So just set Diagram.layout and Group.layout the way you would normally want when you want layouts to occur. Set Layout.isInitial to false and Layout.isOngoing to false on every Layout.

If you don’t want the GridLayout to be invalidated when the viewport changes size, set Layout.isViewportSized to false.

Now if there is some circumstance under which you do want a layout to happen, you can explicitly set Layout.isValidLayout to false on each Layout that you want to perform again, and finally call Diagram.layoutDiagram(false) to actually perform them.

This is not quite accurate,
Actually my application requires NO auto layout at all, since most of the time the end user plan his own diagram by dragging objects onto the diagram and connecting them thru links.
Yet, there are certain cases where i need to use auto layout and immediately return to NO layout.
For example, i have a case where the user group the nodes by some node attribute, called siteId.
So, I run thru all nodes and relate the nodes to their parent group by the node’s siteId attribute.
Then, i would like to auto layout the node groups in a Grid layout.
At this point, i would like to activate the grid layout and return to NO layout right after the nodes were layouted, so that the user will be able to add new nodes or drag the group nodes elsewhere on the diagram.
From reading your answer, i’m not quite sure what are the steps needs to be done.
What are the layout commands that i need to execute for this scenario ?
Could you provide sample code ?

Just make sure that every Layout has Layout.isInitial and Layout.isOngoing set to false. (And Layout.isViewportSized false.)

So when, for example, you add some Nodes to some Group, you can explicitly set someGroup.layout.isValidLayout = false. (It sounds like you might do that for multiple groups.) Then call myDiagram.layoutDiagram(false).

It looks like i cannot read you…
My Code starts with :

diagram.layout = new go.Layout();

Then, at some point, i need to switch to GridLayout and return to simple Layout.
So, if i do :

diagram.layout = new go.GridLayout();
diagram.layout = new go.Layout();

Will it run the autoLayout on the diagram and then switch back to simple Layout ?

No, I recommended going away from resetting Diagram.layout and Group.layout.

Instead, set them the way that you always want them to behave when you want a layout to happen, but disable layout invalidations so that layouts are never performed until you call Diagram.layoutDiagram.

I see,
So you mean work to opposite way,
Upon startup set the Layout but “turn it off” and on demand call the layoutDiagram
Did i understand your approach ?

Yes, that’s right.

Will try

So i created a variable :

var gridLayout = $(go.GridLayout, { isOngoing: false, isInitial: false, isViewportSized: false });

and at some point i call to:

diagram.layout = gridLayout;
diagram.layout.isValidLayout = false;

Works perfect !!

The questions are :

  1. Do i have to call to

diagram.layout = $(go.Layout);

right after the last 3 commands, in order to “return” to normal layout, or the isOngoing, isInitial, isViewportSized retain false after diagram is invalidated and layout is performed ?

  1. Also, I noticed that if DONT call


still, the AutoLayout is performed (because the layout is invalid).
So, do i really have to call it ? or only in very special cases ?

When you initialize your Diagram, include setting its Diagram.layout to your desired GridLayout, but with its three properties set to false. Same goes for each Group.layout.

Then you can set the model and modify the model without any automatic layouts occurring.

Eventually when you want to have a layout happen, set Layout.isValidLayout to false on all such Layouts that you want to be performed, and then call Diagram.layoutDiagram(). Only the invalid layouts will be performed.