Links not respecting portIds when layout.isInitial is set to false

GoJS
1

I am using the TreeLayout where i persist the location information.

When i allow for auto layout, the graph respects the portIds - everything is good.

But when I don’t do the initial layout - all the nodes are correctly positioned. But the links don’t seem to respect the ports. Even as i drag around the port keeps moving/changing ports.

The logic is - if we have persisted locations, don’t perform initial layout. This is when problem happens and the links dont respect portIds from the links array

if(hasPeristedLocations) diagram.layout.isInitial = false;

here is how the links model is setup

        diagram.model =
            $G(go.GraphLinksModel, {
                "linkFromPortIdProperty": "fromPort",
                "linkToPortIdProperty": "toPort",
                nodeDataArray: nodeDataArray,
                linkDataArray: linkDataArray
            });

sample link data

var linkDataArray = [
{ “from”: 1, “to”: 2, “fromPort”: “B”, “toPort”: “T” },
];

my node template

$G(go.Node, “Auto”,
{
selectionAdorned: false
}, new go.Binding(“location”, “”, parseStringToGoPoint).makeTwoWay(stringifyGoPoint),
$G(go.Shape, “Rectangle”,
{ strokeWidth: 1 }),
makeTopPort(),
makeBottomPort()
);

my port templates

return $G(go.Shape, “Circle”, {
fill: “transparent”,
stroke: null,
desiredSize: new go.Size(8, 8),
alignment: go.Spot.Top, alignmentFocus: go.Spot.Top,
portId: “T”,
fromSpot: go.Spot.Top, toSpot: go.Spot.Top,
fromLinkable: false, toLinkable: true,
cursor: “pointer”
});
return $G(go.Shape, “Circle”, {
fill: “transparent”,
stroke: null,
desiredSize: new go.Size(8, 8),
alignment: go.Spot.Bottom, alignmentFocus: go.Spot.Bottom,
portId: “B”,
fromSpot: go.Spot.Bottom, toSpot: go.Spot.Bottom,
fromLinkable: true, toLinkable: false,
cursor: “pointer”
});

link template

$G(go.Link, go.Link.Orthogonal, {
                corner: 5, toShortLength: 4,
                selectable: true,
                curve: go.Link.JumpOver,
                relinkableFrom: true,
                relinkableTo: true
            });
2

That is surprising. Are you sure that with an initial layout the links are correctly connecting with the ports? Try moving a node a lot after the initial tree layout.

Also, without the initial layout, what happens when you delete a node? Assuming you still have Layout.isOngoing set to the default true value, a layout should happen again. Are all of the links suddenly connecting correctly with the nodes?

Without the initial layout, what is the value of myDiagram.model.linkFromPortIdProperty? I’m wondering if you have loaded a model that doesn’t have those two “link…PortIdProperty” properties set, thus depending on the default behavior of TreeLayout to assign the Link.fromSpot and Link.toSpot.

Another way to check on this behavior is to see what happens when you set TreeLayout.setsPortSpot and TreeLayout.setsChildPortSpot to false.

3

Thank you for the prompt reply.

I just saw my mistake, was a typo on my end.
Starred at it too long to not have noticed it.

Thank you.
probably a good idea to delete this post - not valuable for anyone else reading this.

4

Actually it’s a common mistake to set GraphLinksModel.linkFrom/ToPortIdProperty and then not make sure that new models have those properties, so that was my best guess.

Also, people might not be aware that TreeLayout and LayeredDigraphLayout, being “directional” layouts, automatically set Link.from/toSpot.

And certainly typos plague all programmers. I know I’ve been embarrassed many times before. JavaScript’s leniency with creating new properties doesn’t help.

So I think there is still something to be learned from this topic.