I have been trying to create self Loops in GoJS but it is not working. I cannot figure out what exactly the problem is.
graph.diagram(go.Shape, "Circle", { fill: "transparent", stroke: null, // this is changed to "white" in the showPorts function desiredSize: new go.Size(10, 10), 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 fromLinkable: true, toLinkable: true, fromLinkableDuplicates: true, toLinkableDuplicates: true, fromLinkableSelfNode: true, toLinkableSelfNode: true });
This is the port template of Node.
` this.graph.nodeTemplateMap.add(“Default”, this.diagram(go.Node, “Auto”, nodeStyle,
new go.Binding(“location”, “loc”, go.Point.parse),
this.diagram(go.Shape, “RoundedRectangle”,
{
parameter1: 20, // the corner has a large radius
fill: $(go.Brush, “Linear”, { 0: “rgb(254, 201, 0)”, 1: “rgb(254, 162, 0)” }),
stroke: null,
portId: “”, // this Shape is the Node’s port, not the whole Node
fromLinkable: true, fromLinkableSelfNode: true, fromLinkableDuplicates: true,
toLinkable: true, toLinkableSelfNode: true, toLinkableDuplicates: true,
cursor: “pointer”
},
new go.Binding(“figure”, “figure”),
new go.Binding(“fill”, “background”),
new go.Binding(“stroke”, “stroke”),
new go.Binding(“angle”, “angle”)),
this.diagram(go.TextBlock,
{
font: "bold 11pt Helvetica, Arial, sans-serif",
margin: 10,
maxSize: new go.Size(160, NaN),
wrap: go.TextBlock.WrapFit,
editable: false
},
new go.Binding("text", "text"),
new go.Binding("stroke", "color"),
new go.Binding("touchPointId", "tpId")),
this.diagram("Button",
{
alignment: go.Spot.TopRight,
"_buttonFillNormal": "#F7F7F7",
"_buttonStrokeNormal": "#808080",
"_buttonFillOver": "#F7F7F7",
"_buttonStrokeOver": "#808080"
},
this.diagram(go.Shape, "XLine", { width: 5, height: 5, stroke: "#ff0000" }),
{ click: deleteSegment }),
makePort(this, "T", go.Spot.Top, false, true),
makePort(this, "B", go.Spot.Bottom, true, false)
));`
And its the Node Template. Both of them have appropriate settings, but still I am unable to create a Self loop on fly. Can you help me on this.