Strange behaviour of layout : LayeredDigraphLayout

Hello! I have a pretty strange problem with layout. I’m trying to create the simple graph with the root node which has two children. And the last nodes of each branch have the same child. Image below:


All is fine when a graph is symmetric, but when it is asymmetric like the example below, I’m not able to force correct position for the root node (it should be in the center of the row, instead of the right corner).

Another problem appears when I’m trying to add something to the graph. Image below:

Then links totally changed their shapes.

In layout, I’m just use two options:

go.LayeredDigraphLayout,
{
	direction: 90,
	layerSpacing: 20
}

I tried many other options but I didn’t get the desired look. Do you have any suggestions? Should I create a custom layout to apply proper positions for nodes and shapes for links? Thank you in advance for any help.

The Layout will try to line up the center of the Node.locationObject (specified by the Node.locationObjectName). It appears as if you are already doing this, but I wanted to make sure everyone knows about this.

LayeredDigraphLayout tries to position each node in a column. It might be that the width of your new node is such that after covering some number of columns (due to the width of the node) and after adjusting for the center of the locationObject, the absolute positions do not line up nicely. That includes the positions of points in the routes of links that cross over layers.

I think you can improve this by making each of your nodes’ widths to be a multiple of the columnSpacing.and making your locationObjects all the same width. Although when the nodes are different in width the “pressure” from other nodes in the same layer and from trying to move towards the middle may cause unexpected adjustments in the columns.