Make link straight between two ports

Hello,

I have a fat link connected to ports of nodes. The link is coded like this:

diagram.linkTemplateMap.add("fatlink",
      $(go.Link,
        {
          toShortLength: 10,
          margin: 50,
          relinkableFrom: true,
          relinkableTo: true,
          reshapable: false,
        },
        $(go.Shape,  // the link path shape
          { isPanelMain: true, strokeWidth: 8, stroke: "red" }),
        $(go.Shape,  // the arrowhead
          { toArrow: "Triangle", stroke: "red", scale: 2, fill: "red" }),
      ),
    )

Hoever, when I connect the link, it is not straight :

Putting fromEndSegmentLength: 0, toEndSegmentLength: 0, straighten the link:

However, with this solution, as we can see, there is a problem with the arrowhead. toShortLength option doesn’t work for this as toEndSegmentLength is 0.

Do you know how I could straighten the link without arrowhead problem please? Thank you

Do you really want to specify the fromSpot and toSpot the way that you are?

No this is just an exaggeration to show the issue.

But I would like to keep the fromSpot and toSpot because there may be multiple arrows coming from and going to the node so I have multiple ports on the node.

Try this custom Link class in your link template:

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

  CustomLink.prototype.getLinkDirection = function(node, port, linkpoint, spot, from, ortho, othernode, otherport) {
    if (ortho) return go.Link.prototype.getLinkDirection.call(this, node, port, linkpoint, spot, from, ortho, othernode, otherport);
    var pt = this.getLinkPoint(node, port, this.computeSpot(from, port), from, ortho, othernode, otherport);
    var opt = this.getLinkPoint(othernode, otherport, this.computeSpot(!from, otherport), !from, ortho, node, port);
    return pt.directionPoint(opt);
  }