contentAlignment On Demand

Hi,
I would like to Center my node’s/groups on demand.
To be more accurate, as soon as the user presses a key, i divide the nodes into groups and i would like to center the groups in the middle of the diagram. I use the Circular autolayout.
If i do:
diagram.layout = $(go.CircularLayout, { isOngoing: false, isInitial: false, isViewportSized: false });
diagram.contentAlignment = go.Spot.Center;
diagram.layout.isValidLayout = false;
diagram.layoutDiagram(false);

The nodes are auto layout, but then, dragging a node cause the diagram to center all other nodes.
I want to center the groups only when the groups are created ?
How?..
Thanks
Tany

Don’t set Diagram.contentAlignment unless you really want that alignment to happen after every transaction. If you want to align the document contents programmatically, call Diagram.alignDocument.

But here’s what I think you really want to do.

I assume you can find the node(s) that you want to center in the viewport. (If there is more than one node, call Diagram.computePartsBounds to get the area that the nodes cover.)

I assume you know about CommandHandler.scrollToPart and Diagram.scrollToRect and Diagram.centerRect.

If some command might add nodes and/or cause a layout to happen, then the node(s) that you want to center might not yet exist or might not be at their final locations at the time the command is executing. So you need to call scrollToPart or similar method after the layout has completed, after any animation has finished. That means calling that scroll method in a “LayoutCompleted” DiagramEvent listener.

Something like:

function splitIntoGroups() {
    myDiagram.startTransaction();
    ... split into groups ...
    var nodeToCenter = ...
    var doCenter = function() {
        myDiagram.removeDiagramListener("LayoutCompleted", doCenter);
        myDiagram.commandHandler.scrollToPart(nodeToCenter);
    };
    myDiagram.addDiagramListener("LayoutCompleted", doCenter);
    myDiagram.commitTransaction("Split Into Groups");
}

diagram.alignDocument(go.Spot.Center, go.Spot.Center)
did the job.
I’m not sure why should i use the scrollToPart feature.
I dont need to scroll to one of the part,
I just need to center all created groups in the middle of the doc.
I tested the alignDocument.
Works for me.

As i mentioned, it works fine and the diagram is centered.
However, when saving and loading back from Json the diagram is aligned to the top left corner.
I added tooltip to the group node which shows the “loc” value.
I noticed, that although the group nodes are centered, their X location value has a negative value of -41, -43 and so on which is relevant to some point, i believe.
When diagram is saved and loaded from Json, the loc value retain the same, -41, -43 and so on.
I believe that this is the reason that the diagram is aligned to top left corner because i don’t use auto layout when loading from Json, so GOJS uses the “loc” values for positioning the nodes.
So, when creating the centered groups, how can i save the absolute X,Y coordinates of the nodes ?

Are you setting Diagram.initialContentAlignment or Diagram.initialPosition?
http://gojs.net/latest/intro/initialView.html

nope…
I expect the diagram to be layd out as saved.

See how the Draggable Link sample, Draggable Link, saves and loads the Diagram.position.

I see.
Works perfect.
Thanks