Link Connection Points on Nodes

@ilyakut wrote:

Hello, I am using the function "makePort()" (from https://gojs.net/latest/samples/flowchart.html). I need the port was placed on similar place of a Node. But the link moves around the Shape (or the Node)
it is what I want to:

but the line moves around

here my the part of my code:

    function makePort(name, spot, output, input) {
        // the port is basically just a small circle that has a white stroke when it is made visible
        return $(go.Shape, "SQUARE",
            {
                  fill: "RED",
                  stroke: null,  // this is changed to "white" in the showPorts function
                  desiredSize: new go.Size(8, 8),
                  alignment: spot, alignmentFocus: spot,  // align the port on the main Shape
                  portId: name,  // declare this object to be a "port"
                  fromSpot: spot, toSpot: spot,  // declare where links may connect at this port
                  fromLinkable: output, toLinkable: input,  // declare whether the user may draw links to/from here
                  cursor: "pointer"  // show a different cursor to indicate potential link point
            });
    };

        $(go.Node, "Auto",
            {
                rotatable: true, rotateObjectName: "SHAPE", locationSpot: go.Spot.Center, locationObjectName: "SHAPE",
                selectionObjectName: "SHAPE"
            },
            $(go.Panel,
                $(go.Shape,
                    {
                        name: "SHAPE", fill: "transparent",
                        //portId: "", cursor: "pointer", toSpot: go.Spot.Top, toLinkable: true, toMaxLinks: 1,
                        //fromSpot: go.Spot.Bottom, fromLinkable: true, fromMaxLinks: 1,
                        strokeWidth: 1.5, stroke: "#333745", strokeCap: "round", strokeJoin: "round"
                    },
                    new go.Binding("figure", "fig"),
                    new go.Binding("geometry", "geom"))
                    ),
            makePort("R", go.Spot.Right, true, false)
        );

when I am using this:

portId: "", cursor: "pointer", toSpot: go.Spot.Top, toLinkable: true, toMaxLinks: 1,
fromSpot: go.Spot.Bottom, fromLinkable: true, fromMaxLinks: 1,

instead of the function "makePort()" it works properly.

Posts: 4

Participants: 3

Read full topic