BUG: Self Link redraws previous links in differents points

GoJS
1

I need the same diagram like

But, in this example when I draw a self link and reshape it, the next self link will redraw the previous link in differents points.
How I can avoid this problem?

2

That behavior might be intentional – I’ll have to investigate.

3

Another option is using CurvedLinkReshapingTool, but resegmentable property can’t be true.
The CurvedLinkReshapingTool allows to move the link above o bellow of node but not on the left or on the right.
Perhaps you might know how to fix this tool, for doing that.
Regards!

4

The reason that in the State Chart sample the link routes are kept for links between nodes is that Link.adjusting has been set to some non-None value. Without that property, you would expect that as links are added or removed the other links that connect the same pair of ports would want to be rerouted, typically to keep their routes separate so that the user can see that there are multiple links there.

However that is not the behavior for reflexive links, and maybe that’s a bug. I’ll have to think about it some more, and also ponder if there are any compatibility issues if we change the behavior.

In the meantime, you can avoid this behavior by overriding an undocumented Link method.

    function CustomLink() { go.Link.call(this); }
    go.Diagram.inherit(CustomLink, go.Link);

    CustomLink.prototype.arrangeBundledLinks = function(links, reroute) {}

Then use CustomLink instead of go.Link in your template(s).

5

Walter, thank you for you response.
The CustomLink works fine, but there is a problem when I drag & drop a new state from the palette, it doesn’t work again.

6

Could you describe the problem more precisely please? What does a new node have to do with existing links?

7

The CustomLink works fine with a diagram created after “model.fromJson”. Then, if a put a new state from the pallette, it doesn’t work. The behaviour is the same as without CustomLink

8

The user drags in a new node from the Palette and then draws a new reflexive link on that new node, reshapes it, and then draws another new reflexive link at that same node?

But a new reflexive link drawn at an old node does not cause rerouting of other reflexive links?

That’s odd. Are you sure that you have updated all of your link templates to use the CustomLink class instead of go.Link? If in the debugger you look at a newly drawn link at the new node, is it a CustomLink or a regular go.Link? To do this you can select the link and evaluate myDiagram.selection.first().constructor.

9

This is my link template:

var linkTpl = $(CustomLink,
        {
          curve: go.Link.Bezier,
          resegmentable: true,
          corner: 100,
          adjusting: go.Link.Stretch,
          relinkableFrom: true,
          reshapable: true,
          relinkableTo: true,
		  ...
		  });

In this image, I select the new self link (after drop from palette). Then a select a previous existing link.

10

I can’t explain it with the information that I have. And I cannot reproduce the problem. Can you provide such a sample?

11

No problem, I’ll find time for do an example for you. In the meantime I’ll use CurvedLinkReshapingTool as I mentioned before.
There is still another feature on my states that didn’t mention yet: the states can get dynamically items: onentry or onexit parts. This causes the state grow in dimensions, so links will necesary change its points.
So, I think it’s difficult found a general solution to this problem.
I apreciate your effort to solve this topic.
Thankyou very much!

12

Walter, I found a solution for this problem.

In the LinkDrawn event handler, I save the link points:

if(link.fromNode == link.toNode){
      link.fromNode.linksConnected.each(function(l){
        if(l.fromNode == l.toNode) {
          l.points2 = l.points; //backup previous points
        }
      });
    }

In the onModelChanged event handler, I restore the saved points when a link is drawed or deleted.

if (e.propertyName === "CommittedTransaction") {
...
if ((e.object.name === 'Linking' || e.object.name == 'Delete') && e.object.changes) {
		e.object.changes.filter(function (p) {
		  return p.propertyName === 'points';//only takes points changes
		}).each(function (change) {
		  var link = change.object;
		  if (link instanceof go.Link && link.category === 'smLink' && link.fromNode == link.toNode && link.points2) {
                        //restore saved points
			  diagram.startTransaction('restore points');
			  diagram.model.setDataProperty(link.data, 'points', link.points2.toArray());
			  diagram.commitTransaction('restore points');
		  }
		});
}
...
}
13

The latest version, 1.8.13, includes a change to Link.arrangeBundledLinks to address your situation.