Misplaced links after doLayout

GoJS
1

Running gojs 2.0 on ubuntu.

I’ve modified the ContinuousForceDirectedLayout example as follows: when a node is clicked, the layouter switches and for each node an n.move() is performed relative to the clicked node:

…
if (!clickedNode) {
// now perform the normal layout
go.ForceDirectedLayout.prototype.doLayout.call(this, coll);
} else {
this.diagram.nodes.each(function(n) {
var pt = new go.Point(…);
n.move(pt);
});
this.isValidLayout=true;
}
…

The move is performed OK, but a lot of the links between the nodes do not point to the middle of a node, but are ‘misplaced’: the are connected to the correct node, but point to an arbitrary point inside the node.

image

could you advise me how to fix this?

2

Where is that code defined? When is it called?

I’m guessing that you need to perform all of those moves within a single transaction.

3

The code is defined inside the

  ContinuousForceDirectedLayout.prototype.doLayout

override, as copied from the examples pages. It behaves like the example when clickedNode is not set.
I accidentally forgot to include the transaction in this post; the real code more looks like this:

 else {
   state_go.diagram.startTransaction("Layout");
   this.diagram.nodes.each(function(n) {
        var pt = new go.Point(…);
        n.move(pt);
   });
   state_go.diagram.commitTransaction("Layout");
   this.isValidLayout=true;
 }

so the introduction of a transaction doesn’t help.
The re-layout is activated by a call to

state_go.diagram.layout.invalidateLayout();
4

I just tried modifying the InteractiveForce sample, changing the override of doLayout to check a global variable and either do the super call or to call move on each not-isSelected node to shift them towards larger X and Y values.

The unselected nodes moved correctly, the selected nodes did not move, and the links were re-routed correctly.

So I don’t know what you are doing differently.

5

I will try and make a small example that shows the behaviour, and present that to you. Stay tuned…

6

In trying to come up with a minimal example I found the cause of the problem.
For some reason (I cannot recall) the link definition has the following attributes:

 curve: go.Link.Bezier,
 adjusting: go.Link.Stretch,
 reshapable: true

removing the last two lines (not useful for my app anyway) solved the problem.
Thanks for the support, anyway.