OrGate Link is not connecting to its left edge

I am using OrGate in my diagram below is the template for it.

var orTemplate =
goObj(go.Node, “Spot”,
{
background:“red”
},
goObj(go.Shape, “OrGate”,
{
strokeWidth: 1, fill: OrNodeFill, stroke: OrNodeStroke,
}
),
goObj(go.Shape, “Rectangle”, portStyle(true),
{ portId: “L”, alignment: go.Spot.MiddleLeft }),
goObj(go.Shape, “Rectangle”, portStyle(true),
{ portId: “R”, alignment: new go.Spot(1, 0.5) }),
goObj(go.TextBlock,
{
alignment: go.Spot.Center,
textAlign: “center”,
margin: 5,
editable: true
},
new go.Binding(“text”).makeTwoWay()
)
);

Above code is take from Logic Circuit. My problem is toLink is not connecting to OrGate left edge its stopping even before that. When I set a background for node I see a rectangle boundary around OrGate and because of that it is not connecting to the left edge of OrGate. Please refer below screenshot

image

I used the code as given in sample but its not working for me. Could you please help me fixing my issue

Yes, that’s because you have declared there to be two ports on the node, and those ports are not the “OrGate” Shape.

Are you sure you really need exactly two ports on each such node? This works for me:

      myDiagram.nodeTemplate =
        $(go.Node, "Spot",
          $(go.Shape, "OrGate",
          {
            fill: "white", portId: "",
            fromSpot: go.Spot.Right, toSpot: go.Spot.Left, toShortLength: -20,
            fromLinkable: true, toLinkable: true, cursor: "pointer"
          }),
          $(go.TextBlock,
            new go.Binding("text"))
        );

      myDiagram.linkTemplate =
        $(go.Link,
          {
            routing: go.Link.Orthogonal, corner: 10,
            relinkableFrom: true, relinkableTo: true,
            reshapable: true, resegmentable: true,
            toPortChanged: function(link, oldport, newport) {
              link.elt(1).segmentOffset = (newport.figure === "OrGate") ? new go.Point(20, 0) : new go.Point(0, 0);
            }
          },
          $(go.Shape),
          $(go.Shape, { toArrow: "OpenTriangle" })
        );

Note how the Node with the “OrGate” has a negative value for GraphObject.toShortLength, causing it to extend into the port.

Adjusting the position of the arrowhead requires a separate bit of code to set the arrowhead’s GraphObject.segmentOffset to have a positive X value, causing the arrowhead to be further along the path. In this case that means further into the connected port.