temporary Link comes on arrows I want to bring it further
draw, as you see in the gif is moving away
I want temporaryLink to be like this.
how do i do it?
MY temporaryLink :
this.diagram.toolManager.linkingTool.temporaryLink =
goMake(go.Link,
{
curve: go.Link.Bezier,
toShortLength: 0.5,
fromSpot: go.Spot.Right, toSpot: go.Spot.None,
fromEndSegmentLength: 20, toEndSegmentLength: 50,
},
goMake(go.Shape, "RoundedRectangle",
{
isPanelMain: true,
strokeWidth: 1,
stroke: "#777"
}
),
goMake(go.Shape, {
toArrow: "CustomArrowHead",
strokeWidth: 0,
fill: "#777"
})
)
portTargeted event:
this.diagram.toolManager.linkingTool.portTargeted = (node: go.Node, port: go.GraphObject, tempNode: go.Node, tempPort: go.GraphObject, toEnd: boolean) => {
let templink = this.diagram.toolManager.linkingTool.temporaryLink;
if (!port) {
templink.fromEndSegmentLength = 20;
templink.toSpot = go.Spot.None;
} else {
templink.fromEndSegmentLength = 50;
if (port.portId === "L") {
templink.toSpot = go.Spot.LeftSide;
templink.toPort.margin = new go.Margin(5);
} else if (port.portId === "R") {
templink.toSpot = go.Spot.RightSide;
} else if (port.portId === "T") {
templink.toSpot = go.Spot.TopSide;
} else if (port.portId === "B") {
templink.toSpot = go.Spot.BottomSide;
}
}
if (port && port.portId && toEnd) {
this.diagram.nodes.each((other) => {
if (other && other.data && other.data.key === node.part.data.key) {
other.part.findObject("R_H").opacity = .4;
other.part.findObject("L_H").opacity = .4;
other.part.findObject("T_H").opacity = .4;
other.part.findObject("B_H").opacity = .4;
}
});
node.part.findObject(port.portId + "_H").opacity = .8;
this.lastPortSnap = node;
this.portId = port.portId + "_H";
} else {
this.diagram.nodes.each((other) => {
if (other && other.data) {
other.part.findObject("R_H").opacity = 0;
other.part.findObject("L_H").opacity = 0;
other.part.findObject("T_H").opacity = 0;
other.part.findObject("B_H").opacity = 0;
}
});
}
}