Changing the shape of the link to orthogonal,curve and straight

GoJS
1

I have a dropdown having 3 options to change the shape of the link , onClick of that option i will pass a string of orthogonal or curve or straight so based on this i am setting the routing , adjusting , curve property as below
"diagram.startTransaction();
if(lineShape == “Curve”){
console.log(“inside curve”);
model.setDataProperty(nodeObj,“routing”,“None”);
model.setDataProperty(nodeObj,“curve”,“Bezier”);
//model.setDataProperty(nodeObj,“adjusting”,“Stretch”);
}
else if(lineShape == “Orthogonal”){
model.setDataProperty(nodeObj,“routing”,“Orthogonal”);
model.setDataProperty(nodeObj,“curve”,“None”);
model.setDataProperty(nodeObj,“adjusting”,“None”);
}
else if(lineShape == “Straight”){
model.setDataProperty(nodeObj,“routing”,“Normal”);
model.setDataProperty(nodeObj,“curve”,“None”);
model.setDataProperty(nodeObj,“adjusting”,“None”);
}
diagram.commitTransaction(); "

In the linkTemplate i am using the binding for routing , curve , straight as below

“new go.Binding(“routing”, “routing”, function(r) { if (r == ‘Orthogonal’ || r.toString() == “Link.Orthogonal”) { return go.Link.Orthogonal; } else { return go.Link.Normal; } }).makeTwoWay(),
//new go.Binding(“curve”, “curve”, function(c) { if (c != null && (c == ‘Bezier’ || c.toString() == “Link.Bezier”)) { return go.Link.Bezier; } else { return go.Link.None; } }).makeTwoWay(),
new go.Binding(“adjusting”, “adjusting”, function(c) { if (c != null && (c == ‘Stretch’ || c.toString() == “Link.Stretch”)) { return go.Link.Stretch; } else { return go.Link.None; } }).makeTwoWay(),”

the issue is when i select the same option for example i select orthogonal it changes and then again if i click on the same option that is orthogonal it is changing to straight .

Thanks in advance for the help

2

I recommend that you always have the data property value be a string. It should not be an EnumValue such as the value of go.Link.Orthgonal.

The reason you are having this problem is that you did not supply a back-conversion function in the call to Binding.makeTwoWay. Implement that correctly and the data property should always be a simple string.

3

i have tried by using that Binding.makeTwoWay , at that time i got a error saying Binding is not defined
can u share one example for this

4

Have you read GoJS Data Binding -- Northwoods Software? In particular, please read GoJS Data Binding -- Northwoods Software

5

i have tried giving binding like this

  • new go.Binding(‘curve’, ‘curve’, go.Binding.parseEnum(go.Link, go.Link.Normal)).makeTwoWay(),

  • new go.Binding(“curve”, “curve”, function© { if (c != null && (c == ‘Bezier’ || c.toString() == “Link.Bezier”)) { return go.Link.Bezier; } else { return go.Link.None; } }).makeTwoWay(),

both are not working

6

thank you the issue is fixed