Need Twins code without overlapping

How to increase the size of link if text length is more between the two nodes? Please help me on this.

Please don’t send us private messages about public issues.

I’m not sure what you are doing, but usually it is the layout (Diagram.layout) that determines the distance between nodes.

Can you please tell me how and where to send my queries on genogram?

Either here in this forum labeled by the appropriate product line name, or by email to the appropriate product line name @nwoods.com.

Sorry. I am unable to get your point.Can you please send me the link where to post my queries in detail? What is product line name here?I am posting in forum itself. I don’t know what problem is coming here. Please help me ASAP.I need your help on genogram.

I made your private message a public topic and labeled it “GoJS”, because I assumed you are asking about GoJS for HTML and JavaScript. So continuing the conversation here is OK.

Thank you for your help.I am trying to link one twin node to patient with hostile link. But two twin nodes are separated and overlapped. I need to show as twin symbols.
Please see the below code and screen shot.

Javascript code:

myDiagram.linkTemplate =  // for parent-child relationships
	$(TwinLink,  // custom routing for same birth siblings
			{
		routing: go.Link.AvoidsNodes, curve: 1,
		layerName: "Background", selectable: false,
		fromSpot: go.Spot.Bottom, toSpot: go.Spot.Top
			},
			$(go.Shape, { strokeWidth: 2 })
	);

// custom routing for same birth siblings
function TwinLink() {
	go.Link.call(this);
}
go.Diagram.inherit(TwinLink, go.Link);

TwinLink.prototype.computePoints = function() {
	var result = go.Link.prototype.computePoints.call(this);
	var pts = this.points;
	if (pts.length >= 4) {
		var birthId = this.toNode.data["birth"];
		if (birthId) {
			var parents = this.fromNode;
			var sameBirth = 0;
			var sumX = 0;
			var it = parents.findNodesOutOf();
			while (it.next()) {
				var child = it.value;
				if (child.data["birth"] === birthId) {
					sameBirth++;
					sumX += child.location.x;
				}
			}

			if (sameBirth > 0) {
				/* sameBirth = sameBirth +50;
              sumX = sumX + 50;*/
				var midX = sumX/sameBirth;
				var oldp = pts.elt(pts.length-4);
				// pts.setElt(pts.length-3, new go.Point(midX, oldp.y));
				pts.setElt(pts.length-3, new go.Point(midX, oldp.y));


				pts.setElt(pts.length-1, pts.elt(pts.length-1));

				// for below vertical
				pts.setElt(pts.length-3, new go.Point(midX, oldp.y));


            pts.setElt(pts.length-1, pts.elt(pts.length-1));
			}
		}
	}
	
	return result;
};

Please help me on this. This is high priority issue. I need to fix it ASAP. :(

This stuff is fairly complicated and has already been customized, so I don’t understand the situation well and I certainly don’t know what it is that you are trying to do. You’ll need to provide more specific information about the situation and what is happening and what you want to happen instead.

Also, the title for this topic doesn’t make sense to me either, given what you have just posted.

Ok. Sorry title is not for this query.Both are differernt. Is it fine to continue post here or shall I try to post separately? Is it possible to discuss directly with you about this query if not getting my point?

Different subjects deserve separate forum topics, else it gets very confusing. I suggest that you edit the title of this topic so that it summarizes what you are asking about here.

If I give hostile link from Patient node to twin node then one generation of twin node is displaying or dragging to below generation. Why it is happening. Please see the below image FYR.
Please let me know if needed any clarifications and help me ASAP.

My Twin java script code is given below:

myDiagram.linkTemplate =  // for parent-child relationships
	$(TwinLink,  // custom routing for same birth siblings
			{
		routing: go.Link.AvoidsNodes, curve: 1,
		layerName: "Background", selectable: false,
		fromSpot: go.Spot.Bottom, toSpot: go.Spot.Top
			},
			$(go.Shape, { strokeWidth: 2 })
	);


// custom routing for same birth siblings
function TwinLink() {
	go.Link.call(this);
}
go.Diagram.inherit(TwinLink, go.Link);

TwinLink.prototype.computePoints = function() {
	var result = go.Link.prototype.computePoints.call(this);
	var pts = this.points;
	if (pts.length >= 4) {
		var birthId = this.toNode.data["birth"];
		if (birthId) {
			var parents = this.fromNode;
			var sameBirth = 0;
			var sumX = 0;
			var it = parents.findNodesOutOf();
			while (it.next()) {
				var child = it.value;
				if (child.data["birth"] === birthId) {
					sameBirth++;
					sumX += child.location.x;
				}
			}

			if (sameBirth > 0) {
				/* sameBirth = sameBirth +50;
              sumX = sumX + 50;*/
				var midX = sumX/sameBirth;
				var oldp = pts.elt(pts.length-4);
				// pts.setElt(pts.length-3, new go.Point(midX, oldp.y));
				pts.setElt(pts.length-3, new go.Point(midX, oldp.y));


				pts.setElt(pts.length-1, pts.elt(pts.length-1));

				// for below vertical
				pts.setElt(pts.length-3, new go.Point(midX, oldp.y));


            pts.setElt(pts.length-1, pts.elt(pts.length-1));
			}
		}
	}
	
	return result;
};

If I am not applying any vertical links to twin nodes then I am getting twins link as shown in the below screenshot.

I still have no idea of what you are doing. What are “vertical links”? What are “hostile links”? How are those implemented?

My guess: those links should have Part.isLayoutPositioned set to false, so that they don’t mess up GenogramLayout.

Vertical links are links coming from one generation to another generation. Hostile link is zigzag line which shows in the screen shot. Where to put Part.isLayoutPositioned in genogram code.

On those two kinds of links.

Ya Thank you for your valuable solution.

Added isLayoutPositioned:fasle in the below code.

myDiagram.linkTemplateMap.add("NewLinkFormats",  
			$(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:false },
					$(go.Shape, { strokeWidth: 2 },
							new go.Binding("stroke", "patt", function(f) { return (f === "") ? "black" : "transparent"; }),
							new go.Binding("pathPattern", "patt", convertPathPatternToShape)),
							
			))	 ;

After putting isLayoutPositioned:fasle, Pt child 3 is displaying in 3rd generation. But it should be in second generation. Why it is like that? Please help me.

I have no idea – perhaps you didn’t set up the nodes and links the right way for GenogramLayout/LayeredDigraphLayout to treat that node as a child of the marriage of its parents.

This is my data: { key: 4, name: “Pt child 3”,s: “F”,age:“34”,m:1,f:0,la:1},

This is full genogram data. Given exact data only.

	{ key: 0, name: "Patient",s:"FM",age:70,occupation:"Retired Carpenter",group:"images/H1.png",relationText:"1=m:1980"},//,relationText:"1=12345678901234567890 12345678901234567890"},//,h:2
		{ key: 1, name: "Patient's wife",vir:0,s: "F",age:"68",occupation:"ADL Independent",group:"images/H1.png",relationText:"0=m:1980",sh:4},
		
		{ key: 2, name: "Pt child 1",s: "M",age:"39",m:1,f:0},
		{ key: 3, name: "Pt child 2",s: "F",age:"36",m:1,f:0},
		{ key: 4, name: "Pt child 3",s: "F",age:"34",m:1,f:0,la:1},
		{ key: 5, name: "Pt child 4",s: "M",age:"32",occupation:"Bank Manager",m:1,f:0,nla:0,group:"images/H1.png",relationText:"0=younger son"},
		
		{ key: 6, name: "Pt child 1 Ex-wife",s: "F",age:"30",vir:2,div:2,relationText:"2=d:2008"},
		{ key: 7, name: "Pt child 1 wife",s: "F",age:"28",vir:2,relationText:"2=12345678901234567890 12345678901234567890"},
		
		//child 1
		{ key: 8, name: "Miscarriage 2011",s:"MC",m:7,f:2,relationText:"7=Miscarriage 1"},
		{ key: 9, name: "Miscarriage 2011",s:"MC",m:7,f:2,relationText:"7=Miscarriage 1"},
		{ key: 10, name: "Pt Child 1 male",s:"M",age:"3",m:7,f:2,relationText:"7=elder child"},
		
		//child 2
		{ key: 11, name: "Pt Child 2 hub",s:"M",age:"40",ux:3,relationText:"3=m:2012"},
		
		{ key: 12, name: "Twin 1",s:"F",age:"4",m:3,f:11,birth:1,group:"images/H1.png"},
		{ key: 13, name: "Twin 2",s:"F",age:"4",m:3,f:11,birth:1,group:"images/H1.png"},//,sch:0,sslivliv:10
		
		//child 4
		{ key: 14, name: "Pt Child 4 wife",s:"F",age:"28",vir:5,occupation:"Housewife",group:"images/H1.png"},
		
		{ key: 15, name: "Pt Child 4 female",s:"F",age:"3",f:5,m:14,group:"images/H1.png"},
		{ key: 16, name: "Pt Child 4 male",s:"M",age:"2",f:5,m:14,group:"images/H1.png"},
		{ key: 17, name: "Abortion 2018",s:"PA",f:5,m:14,group:"images/H1.png",relationText:"14=Abortion"},


Is this correct way to give ,isLayoutPositioned:false in the below code?

myDiagram.linkTemplateMap.add("NewLinkFormats",
$(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:false },
$(go.Shape, { strokeWidth: 2 },
new go.Binding("stroke", "patt", function(f) { return (f === "") ? "black" : "transparent"; }),
new go.Binding("pathPattern", "patt", convertPathPatternToShape)),

		))	 ;

When I use that data in my copy of GenogramTwins, I don’t have any problem with a parent link skipping a generation.

Not that the layout is great – it’s definitely non-optimal. We hope someday to completely reimplement GenogramLayout to work better, but it’s not scheduled.

Wow it is working fine now. Actually I am adding so many linkTemplateMap. I am using isLayoutPositioned:false in SingleNode_NewLinkFormats and rest I kept true.

myDiagram.linkTemplateMap.add("Marriage",  
			$(go.Link,
					{ selectable: false, routing: go.Link.AvoidsNodes,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,alignment: go.Spot.Top,segmentOffset: new go.Point(0, 10) }, new go.Binding("text", "relationText")), //,wrap: go.TextBlock.WrapFit, isMultiline: true,maxSize:new go.Size(150, 100)
							$(go.TextBlock, {margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -20)}, new go.Binding("text", "srelationText"))
			));
myDiagram.linkTemplateMap.add("NewLinkFormats",  
		$(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,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,segmentIndex: 2.6, segmentFraction: 0.5,alignment: go.Spot.Center,segmentOffset: new go.Point(0, 20) }, new go.Binding("text", "relationText")),//segmentOrientation: go.Link.OrientUpright
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10) }, new go.Binding("text", "srelationText"))
					
						
		))	 ;
myDiagram.linkTemplateMap.add("SingleNode_NewLinkFormats",  
		$(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:false  },
				$(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,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10) }, new go.Binding("text", "relationText")),//segmentOrientation: go.Link.OrientUpright
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -20)}, new go.Binding("text", "srelationText"))
					
						
		))	 ;
myDiagram.linkTemplateMap.add("SeparationLinkFormat",  
		$(go.Link,  { selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:true  },
				$(go.Shape, 
						{  strokeWidth: 2 },
						new go.Binding("stroke", "patt", function(f) { return (f === "") ? "black" : "transparent"; }),
						new go.Binding("pathPattern", "patt", convertPathPatternToShape)),
						$(go.Shape, "Line2", { width: 20, height: 20, strokeWidth: 2, stroke: "black" }),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(10, -15)}, new go.Binding("text", "relationText")),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10)}, new go.Binding("text", "srelationText"))
		));

myDiagram.linkTemplateMap.add("DivorceLinkFormat",  
		$(go.Link,  { selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:true  },
				$(go.Shape, 
						{ strokeWidth: 2 },
						new go.Binding("stroke", "patt", function(f) { return (f === "") ? "black" : "transparent"; }),
						new go.Binding("pathPattern", "patt", convertPathPatternToShape)),
						$(go.Shape, {geometryString: "m 0,8 l 14,-8 m -2,8 l 14,-8", width: 20, height: 20, strokeWidth: 2, stroke: "black" }),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, 20)}, new go.Binding("text", "relationText")),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10)}, new go.Binding("text", "srelationText"))
		));


myDiagram.linkTemplateMap.add("MarriedAndHostile",  
		$(go.Link,  { selectable: false, routing: go.Link.AvoidsNodes,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,alignment: go.Spot.Top,segmentOffset: new go.Point(10, -15)}, new go.Binding("text", "relationText")),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10)}, new go.Binding("text", "srelationText"))
		));
myDiagram.linkTemplateMap.add("DomesticWorker",  
		$(go.Link,
				{ selectable: false, routing: go.Link.AvoidsNodes,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,segmentOffset: new go.Point(-10, -50),segmentOrientation: go.Link.OrientUpLeft }, new go.Binding("text", "relationText")),
						$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10)}, new go.Binding("text", "srelationText"))
		));

Now working fine.
Thank you very much.I appreciated your knowledge on genogram.