Relinking combined with adjusting go.Link.End

GoJS
1

Hi,

we’ve observed a suprising behaviour:
If we have a link with adjusting: go.Link.End and we use the RelinkingTool to move this link to another node we get the visual representation shown in the gif below:

relinking_free_routing

Although the user is not able to connect the link to another node and connect three nodes with one link, it looks like it’s possible and therefore is confusing some users.

Is this the intended behaviour? I would expect to break the connection to the first new node and relink to the second.

Code:

<!DOCTYPE html>
<html lang="en">

<body>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/release/go.js"></script>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism.min.css" rel="stylesheet" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script>

  <div id="allSampleContent" class="p-4 w-full">
    <script id="code">
      function init() {
        diagram = new go.Diagram('myDiagramDiv', {

        });

        diagram.nodeTemplate =
          new go.Node("Auto")
            .bind("location", "loc", go.Point.parse)
            .add(
              new go.Shape("RoundedRectangle",
                {
                  fill: "lightgray",
                  portId: "",
                  fromLinkable: true,
                  toLinkable: true,
                  toSpot: go.Spot.TopCenter,
                  fromSpot: go.Spot.BottomCenter
                }),
              new go.TextBlock({ margin: 5 })
                .bind("text", "key")
            );

        diagram.linkTemplate =
          new go.Link({
            adjusting: go.Link.End,
            relinkableTo: true,
            relinkableFrom: true,
            toShortLength: 4,
            fromShortLength: 2,
          })
            .add(
              new go.Shape(),                           // this is the link shape (the line)
              new go.Shape({ toArrow: "Standard" }),  // this is an arrowhead
            ).bind(new go.Binding("points").makeTwoWay());

        const nodeDataArray = [
          { key: "Alpha", loc: "0 0" },
          { key: "Beta", loc: "50 100" },
          { key: "Delta", loc: "100 100" }
        ];
        const linkDataArray = [
          { from: "Alpha", to: "Beta" }
        ];
        diagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray);

      }

      window.addEventListener('DOMContentLoaded', init);
    </script>

    <div id="sample">
      <div id="myDiagramDiv" style="border: solid 1px black; width: 100%; height: 470px; background: whitesmoke"></div>
    </div>
  </div>
</body>

</html>
2

Override the RelinkingTool.copyLinkProperties method to call the super method and then set the Link.adjusting to LinkAdjusting.None.

Install your custom tool by replacing the standard RelinkingTool:

new go.Diagram(. . ., {
  relinkingTool: new CustomRelinkingTool(),
  . . .
})