Issues with go.Link.AvoidsNodes

@theodu60 wrote:

GoJS 1.8 in Angular 6

Hi,

First of all, thank for this amazing library !!

I’m trying to link some nodes with go.Link.AvoidsNodes but the links are getting over the node:

BUG_avoidNode.gif1296x972 2.15 MB

Can you help me please ?

// elements
const square = {
    width: 90,
    height: 90,
    inports: [],
    outports: [{ label: "OUT", x: 82, y: 38 }],
}
const rect = {
    width: 200,
    height: 240,
    inports: [{ label: "IN", x: 0, y: 107 }],
    outports: [
      { label: "PSV", x: 180, y: 32 },
      { label: "GAS", x: 0, y: 41 },
      { label: "OIL", x: 0, y: 190 },
      { label: "WAT", x: 0, y: 225 }
    ],
}
// config for all elements
makeElement(width, height, inports, outports): any {
    const node = go.GraphObject.make(
        go.Node,
        "Auto",
        { locationSpot: go.Spot.Center, rotatable: true },
        go.GraphObject.make(
          go.Panel,
          "Position",
          { width, height },
          go.GraphObject.make(go.Shape, "Rectangle", {
            fill: "blue",
            width,
            height,
            stroke: null,
            strokeWidth: 0,
            spot1: go.Spot.TopLeft,
            spot2: go.Spot.BottomRight
          }),
          go.GraphObject.make(
            go.Panel,
            "Position",
            inports.map((y) => {
                return this.makePort(y.label, new go.Point(y.x, y.y), "IN");
            })
          ),
          go.GraphObject.make(
            go.Panel,
            "Position",
            outports.map((y) => {
                return this.makePort(y.label, new go.Point(y.x, y.y), "IN");
            })
          )
        )
      );
      return node
}
// config for ports
  makePort(name, position, way): any {
    const port = go.GraphObject.make(go.Shape, "Rectangle", {
      fill: "gray",
      stroke: null,
      desiredSize: new go.Size(8, 8),
      portId: name,
      toMaxLinks: 1,
      cursor: "pointer"
    });
    const panel = go.GraphObject.make(go.Panel, "Horizontal", {
      margin: new go.Margin(2, 0)
    });
    port.toLinkable = way === "IN";
    port.fromLinkable = way === "OUT";
    panel.position = position;
    panel.add(port);
    return panel;
  }
// config for links
  linkTemplate(deletable): any {
    return go.GraphObject.make(
      go.Link,
      {
        routing: go.Link.AvoidsNodes,
        corner: 5,
        curve: go.Link.JumpOver,
        reshapable: true,
        resegmentable: true,
        relinkableFrom: true,
        relinkableTo: true,
        deletable
      },
      new go.Binding("fromSpot", "fromSpot", go.Spot.parse),
      new go.Binding("toSpot", "toSpot", go.Spot.parse),
      new go.Binding("points").makeTwoWay(),
      go.GraphObject.make(
        go.Shape,
        { stroke: "#2F4F4F", strokeWidth: 3 },
        new go.Binding("stroke", "stroke")
      ),
      go.GraphObject.make(
        go.Panel,
        "Auto",
        go.GraphObject.make(go.Shape, "Rectangle", {
          fill: "yellow",
          stroke: "gray"
        }),
        go.GraphObject.make(
          go.TextBlock,
          { margin: 5 },
          new go.Binding("text", "label")
        )
      )
    );
  }

Thanks !

Posts: 1

Participants: 1

Read full topic