Text should be aligned at exact position

GoJS
1

Hi Walter,

Please see the below screenshot. Like how Child1, Child2 and Child3 displayed at child links, same position I need to displayed all the child texts.

image
image.png1166×306 16.3 KB

But problem is if I added the children for ccc,ddd and eee, then text is displaying another position. This should not happen.
Please see the below screenshot for your reference:
I added child to ccc and kkk. See all the child1, child2 and child3 are overlapping in one position.

image
image.png1186×412 19.4 KB

My requirement is even if I add children for ccc,ddd and eee, child text should display like in first screenshot.

My code is below :


                {"key": "0", "name": "aaa","s":"FM","age":"65"},
				{"key": "1", "name": "bbb","s":"F","livh":"0","age":"64"},
				{key: 2, name: "ccc",s:"M",age:"35",m:"1",f:0,"relationText":"1=child1",srelationText:"0=closeHostile"},
				{key: 3, name: "ddd",s:"M",age:"33",f:0,m:1,relationText:"1=child2"},// need to check this
				{key: 4, name: "eee",s:"M",age:"31",f:0,m:1,relationText:"1=child3",srelationText:"1=Living Together"},
				
				{key: 14, name: "kkk",s:"F",age:"26",vir:2},
				{key: 15, name: "lll",s:"F",age:"3",relationText:"2=child of ccc",f:2,m:14},
				
				{key: 11, name: "kkk",s:"F",age:"26",relationText:"3=Wife of ddd",vir:3},
				{key: 16, name: "kkk",s:"F",age:"26",vir:4},

myDiagram.linkTemplateMap.add("ParentChild",  
			$(go.Link,
					{selectable: false, routing: go.Link.AvoidsNodes,layerName: "Background",isLayoutPositioned:true},
					$(go.Shape, { strokeWidth: 2},
							new go.Binding("stroke", "patt", function(f) { return (f === "") ? "black" : "transparent"; }),
							new go.Binding("pathPattern", "patt", convertPathPatternToShape)),
							$(go.TextBlock, { margin: 2,wrap: go.TextBlock.WrapFit, isMultiline: true,maxSize:new go.Size(90,100),margin: -2,segmentIndex: 2.6, segmentFraction: 0.5,alignment: go.Spot.Center,segmentOffset: new go.Point(20, -30) }, new go.Binding("text", "relationText")),
							$(go.TextBlock, { margin: 2,wrap: go.TextBlock.WrapFit, isMultiline: true,maxSize:new go.Size(90,100),margin: -2,segmentIndex: 2.6, segmentFraction: 0.5,alignment: go.Spot.Center,segmentOffset: new go.Point(20, -30)}, new go.Binding("text", "srelationText"))
			));

myDiagram.linkTemplate = 
		$(go.Link,
				{
			routing: go.Link.AvoidsNodes,
			adjusting: go.Link.End,
			 corner: 5,
		        toShortLength: 4,	
			relinkableFrom: true,
			relinkableTo: true,
			reshapable: false,
			resegmentable: true,
		},
				$(go.Shape, { strokeWidth: 2 })
		);

Please let me know anything required.

Thanks,
Prameela.D

2

GraphObject.segmentIndex must be an integer, not a floating-point number. I suggest trying the value -2, which is the penultimate segment of the orthogonal link.

3

Hi Walter,

It is working fine for me. Thanks a lot.

Thanks,
Prameela.D