Align link to port center

@soumyajit wrote:

I am creating ports using fractional values in go.Spot. But the links going out and in to ports that are not in the middle have alignments issues.

I have attached a screenshot to explain it better.

image793×584 12.6 KB

Is there any alignment configuration that is needed?

This is my port creation function -

function makePort(name, spot) {
  return $(
    go.Panel,
    'Auto',
    {
      desiredSize: new go.Size(10, 10),
      alignment: spot,
      fromSpot: spot,
      toSpot: spot,
      cursor: 'pointer',
      fromLinkable: true,
      toLinkable: true,
    },
    new go.Binding('portId', 'key', key => `${name}::${key}`),
    $(go.Shape, 'Rectangle', {
      fill: lightBlue[50],
      stroke: null,
      desiredSize: new go.Size(10, 10),
    }),
    $(go.Shape, 'XLine', {
      fill: null,
      alignment: go.Spot.Center,
      stroke: blueGrey[500],
      desiredSize: new go.Size(5, 5),
    })
  );
}

Also, I use this to display the ports on mouseOver a node. But cannot figure out how to get access to the XLine shape in the port here -

/**
 * function to conditionally make ports visible
 * @param {go.Node} node
 * @param {boolean} show
 */
function showPorts(node, show) {
  node.ports.each(function(port) {
    if (port.portId) {
      // change port XLine stroke color here
    }
  });
}

Posts: 1

Participants: 1

Read full topic