Links are unaligned in GoJs

@mw wrote:

WX20180404-092324@2x.png1380x1054 55 KB

The following json is the options.
The green dot is from point,red dot is to point.

{
"class": "go.GraphLinksModel",
"linkFromPortIdProperty": "fromPort",
"linkToPortIdProperty": "toPort",
"nodeDataArray": [
{"width":86,"height":86,"key":0,"loc":"0 150","text":"a","resource":{"id":"aaa","label":"aaaa"},"x":329,"y":209},
{"width":86,"height":86,"key":1,"text":"b","resource":{"nodeType":"branch"},"x":329,"y":375}, {"width":86,"height":86,"key":2,"text":"c","resource":{},"x":472,"y":541}, {"width":86,"height":86,"key":3,"text":"d","resource":{"nodeType":"branch"},"x":43,"y":707}, {"width":86,"height":86,"key":4,"text":"e","resource":{},"x":329,"y":707}, {"width":86,"height":86,"key":5,"text":"f","resource":{},"x":615,"y":707}, {"width":86,"height":86,"key":-1,"category":"Start","text":"Start","resource":{"label":"sss"},"x":329,"y":43},
{"width":86,"height":86,"key":-2,"category":"End","text":"Enjoy!","resource":{"label":"sss"},"x":329,"y":873}
],
"linkDataArray": [
// {"from": -1, "to": -2, "fromPort":"B", "toPort":"T"}
{"from": -1, "to": 0, "fromPort":"B", "toPort":"T"},
{"from": 0, "to": 1, "fromPort":"B", "toPort":"T"},
{"from": 1, "to": 2, "fromPort":"B", "toPort":"T"},
{"from": 1, "to": 3, "fromPort":"B", "toPort":"T"},
{"from": 3, "to": -2, "fromPort":"B", "toPort":"T"},
{"from": 2, "to": 4, "fromPort":"B", "toPort":"T"},
{"from": 2, "to": 5, "fromPort":"B", "toPort":"T"},
{"from": 4, "to": -2, "fromPort":"B", "toPort":"T"},
{"from": 5, "to": -2, "fromPort":"B", "toPort":"T"},
]}

The linkTemplate:

myDiagram.linkTemplate =
$(go.Link, // the whole link panel
{
zOrder: 1,
selectable: false,
routing: go.Link.AvoidsNodes,
curve: go.Link.JumpOver,
corner: 20,
},
new go.Binding("points").makeTwoWay(),
$(go.Shape, // the highlight shape, normally transparent
{ isPanelMain: true, strokeWidth: 8, stroke: "transparent", name: "HIGHLIGHT" }),
$(go.Shape, // the link path shape
{ isPanelMain: true, stroke: "#becce0", strokeWidth: 2 }),
$(go.Shape, // the arrowhead
{ toArrow: "standard", stroke: null, fill: "#becce0"}),
$(go.Panel, "Auto", // the link label, normally not visible
{ visible: false, name: "LABEL", segmentIndex: 2, segmentFraction: 0.5},
new go.Binding("visible", "visible").makeTwoWay(),
$(go.Shape, "RoundedRectangle", // the label shape
{ fill: "#F8F8F8", stroke: null }),
$(go.TextBlock, "Yes", // the label
{
textAlign: "center",
font: "10pt helvetica, arial, sans-serif",
stroke: "#333333",
editable: true
},
new go.Binding("text").makeTwoWay())
)
);

image.png830x1156 53.8 KB

I'm binding location for the nodes.
The lines are unaligned,and the under is ok.
This problem is uncontrollable.

Posts: 1

Participants: 1

Read full topic