[Question]How to make a fixed relative position of ports ?

[LSTM-Kirigaya]

I want to specifiy the relative position of the ports, because the default calculated x, y of ports are not the same with my svg. For example, how is my svg:

<?xml version="1.0" encoding="utf-8"?>
<svg width="121" height="62" viewBox="0 0 121 62" fill="none" xmlns="http://www.w3.org/2000/svg">
  <g transform="translate(1 1)">
    <rect width="119" height="60" />
    <path id="AND" d="M0 0C0 0 35.7 0 35.7 0C55.4183 0 71.4 13.43 71.4 30C71.4 46.57 55.4183 60 35.7 60C35.7 60 0 60 0 60L0 0Z" fill="#279BB0" fill-rule="evenodd" stroke-width="2" stroke="#000000" transform="translate(24 0)" />
    <path id="Y" d="M0 0L23 0" fill="none" stroke-width="2" stroke="#000000" stroke-linecap="square" transform="translate(96 29)" />
    <path id="A" d="M0 0L23 0" fill="none" stroke-width="2" stroke="#000000" stroke-linecap="square" transform="translate(0 14)" />
    <path id="B" d="M0 0L23 0" fill="none" stroke-width="2" stroke="#000000" stroke-linecap="square" transform="translate(0 44)" />
  </g>
</svg>

As you can see, the height is 60 and A, B and Y have a offsetY as 29, 14 and 44.

                const ports = [];

                const leftSideConnections = [];
                const rightSideConnections = [];

                for (const conn of cell.nameToConnection.values()) {
                    if (conn.direction === 'input') {
                        leftSideConnections.push(conn);
                    } else {
                        rightSideConnections.push(conn);
                    }
                }

                for (let i = 0; i < leftSideConnections.length; ++ i) {
                    const connection = leftSideConnections[i];
                    const yOffset = meta.getPortYOffset(connection.name) * SKIN_SCALE;

                    ports.push({
                        id: connection.id,
                        renderName: connection.name,
                        renderType: 'cellPort',
                        width: 0,
                        height: 0,
                        x: 0,
                        y: yOffset,
                        properties: {
                            'port.side': ELK_DIRECTION.LEFT,
                        }   
                    });

                    console.log(ports.at(-1).properties["port.anchor"]);
                    
                }

                for (let i = 0; i < rightSideConnections.length; ++ i) {
                    const connection = rightSideConnections[i];
                    const yOffset = meta.getPortYOffset(connection.name) * SKIN_SCALE;

                    ports.push({
                        id: connection.id,
                        renderName: connection.name,
                        renderType: 'cellPort',
                        width: 0,
                        height: 0,
                        x: 0,
                        y: yOffset,
                        properties: {
                            'port.side': ELK_DIRECTION.RIGHT
                        }   
                    });
                }

And final render effect is

As you can see, the calculated connection to port to not consistent with the svg's. I don't know how to fix the relative position of ports, I assign x and y in port as follows, but it doesn't work:

                    ports.push({
                        id: connection.id,
                        renderName: connection.name,
                        renderType: 'cellPort',
                        width: 0,
                        height: 0,
                        x: 0,
                        y: yOffset,
                        properties: {
                            'port.side': ELK_DIRECTION.RIGHT
                        }   
                    });

[LSTM-Kirigaya]

I solve the problem with followings:

                const node = {
                    id: cell.id,
                    renderName: cell.type,
                    renderType: 'cell',
                    width,
                    height,
                    ports,
                    layoutOptions: {
                        'org.eclipse.elk.portConstraints': 'FIXED_POS'
                    }
                };

Then, assign x and y in each port, the port.x and port.y will not be changed during the calcualtion of elk.layout

[soerendomroes]

Using FIXED_POS` port constraints and setting the desired position works. However, your port positions still seem to be off by one (or a half) pixel.