Incorrect routing of links on first layoutDiagram(), but correct after the second when changing layout direction dynamically

GoJS
1

Hello,

I have a diagram using the LayeredDiagramLayout, by default with a vertical orientation:

image
image.png356×594 20 KB

I have a button in our application which dynamically changes the orientation from vertical to horizontal. I do so by keeping the diagram properties around and when the user clicks the button, I change the layout.direction to 0 (from 90).

The problem is that on the next relayout, the links are not routed cleanly:

image
image.png1156×156 17.6 KB

If, after that automatic layout, I perform another layoutDiagram(true) a little later, the links are then properly routed:

image
image.png1178×153 17.4 KB

How can I avoid the second layoutDiagram(true)?

Thanks!
Marc.

2

Have you set fromSpot or toSpot on anything? What properties have you set on your Links?

I just tried it, and was unable to reproduce the problem. By the way, precisely which version of GoJS are you using? Evaluate go.version.

3

Hi Walter!

goJS is at version 2.0.4.
I do have fromSpot and toSpot set through bindings that depend on the direction of the layout, like so:

new go.Binding("fromSpot", "", _toFromSpot).ofObject(),
new go.Binding("toSpot", "", _toToSpot).ofObject(),

where _toFromSpot, for example, is defined as:

private static _toFromSpot(node: go.Node): go.Spot {
	if (node.diagram == null) {
		return go.Spot.None;
	}
	return !((node.data as NodeData).model.isHorizontal) ? go.Spot.BottomCenter : go.Spot.RightCenter;
}

The links have a number of settings as you would imagine:

{
	routing: go.Link.AvoidsNodes,
	curve: go.Link.JumpOver,
	corner: 5,
	fromEndSegmentLength: 20,
	toEndSegmentLength: 20,
	layerName: "Background"
}
new go.Binding("layerName", "isSelected", isSelected => isSelected ? "Foreground" : "").ofObject(),
...
4

Try removing those two Bindings, of fromSpot and toSpot.

5

Well it does look like that the fromSpot and toSpot are not necessary here. However, removing them does not fix the problem I indicated above: I still need 2 calls to layoutDiagram(true).

6

Try setting Link.routing to go.Link.Orthogonal.

7

Unfortunately, I get the same thing (and I do want nodes to be avoided by links though).

8

Normally the layout will make sure that links do not cross over nodes.

I have no idea of why you are having that problem – I cannot reproduce it. Could you please create a minimal sample that reproduces the problem?

9

Thanks for looking into this Walter.

I managed to fix this problem by accident: I only discovered the toModel() binding option yesterday (after all these years) and I wanted to try it out.
I had 4 toObject() bindings which were checking properties of the node’s diagram and then returned a Spot by checking a property of an object held by the node’s nodeData --2 of these bindings were alignments for “handles” on the diagram nodes, the other 2 were the from and to spots.
When I replaced these toObject() bindings with toModel() ones by centralizing the information I needed on the model’s modelData, I noticed the problem was not occurring anymore.

It is almost as if transiently, the information was not the same on all nodes (or was changed while doing the routing), leading to an incorrect routing of the links. Using toObject() made everything properly synchronous.

Sorry I cannot be more precise.

10

I still do not understand why you have any Binding of fromSpot or toSpot at all – you should be letting the layout determine the routing, including setting the spots on the Links.

11

OK, I removed these bindings altogether. Thanks again.