Hi,
Can you please provide me the code for adopted child link in genogram.
See the above diagram, How can I draw Adopted Child link in genogram? Is there any abbrevation codes for Adopted Child like ux - Wife, vir-husband, f- father,m-mother?
You can change the appearance of a Link’s path Shape by setting or binding its properties Shape.stroke, Shape.strokeWidth, and Shape.strokeDashArray.
I need full code to display legally adopted child. Can you please provide?
I am using the below code to display legally adopted.
PathPatterns.add(“LegallyAdopted”, $(go.Shape,{geometryString: “M7 3 M3 0 L9 0 M3 3 L5 3”, fill: “transparent”,stroke: “black”,strokeWidth: 1,strokeCap: “square”}));
function convertPathPatternToShape(name) {
if (!name) return null;
return PathPatterns.getValue(name);
}
var PathPatterns = new go.Map(‘string’, go.Shape);
myDiagram.linkTemplateMap.add(“NewLinkFormats”,
(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:true,curve: go.Link.JumpGap,segmentFraction: 0.5 },
(go.Shape, { strokeWidth: 2 },
new go.Binding(“stroke”, “patt”, function(f) { return (f === “”) ? “black” : “transparent”; }),
new go.Binding(“pathPattern”, “patt”, convertPathPatternToShape)),
(go.TextBlock, { segmentFraction: 0.5, 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”))
)) ;
if(adopted !== undefined) {
//alert("adopted "+relationText);
if (mother !== undefined && father !== undefined) {
var link = findMarriage(diagram, mother, father);
if (link === null) {
if (window.console) window.console.log("unknown marriage: " + mother + " & " + father);
continue;
}
var mdata = link.data;
var mlabkey = mdata.labelKeys[0];
var remarks_la;
remarks_la = data.la;
//alert(“adopted :”+adopted);
// var cdata = { from: mlabkey, to: key, category: “NewLinkFormats”,patt: “LegallyAdopted”, relationText:relationText};
var cdata = { from: mlabkey, to: key, patt: “LegallyAdopted”,category: “Child_NewLinkFormats”,relationText:remarks(relationText,mlabkey,remarks_la,key)};
myDiagram.model.addLinkData(cdata);//
}
}
If I use the above code then link is coming at the center of marriage link:
I need to display like below image:
I must say that it’s hard for me to help you when your code is not formatted properly. Surround your code with lines consisting only of three backquote characters. Code Formatting
My suggestion about setting or binding Shape.strokeDashArray was assuming that you were using a normal Shape as the Link.path.
If that Shape is being drawn with a path pattern, you will need to augment your conversion function so that it returns the desired pattern.
Hi,
Sorry for not formatted code properly.
In below line, I am using ,strokeDashArray: [0.2,0]. But not the expected output. Please help me.
PathPatterns.add(“LegallyAdopted”, $(go.Shape,{geometryString: “M7 3 M3 0 L9 0 M3 3 L5 3”, stroke: “black”, strokeWidth: 1,strokeDashArray: [0.2,0]}));
Output:
By setting properties on the Shape that forms the path pattern, that means the object that is being repeatedly drawn along the link’s route will each be drawn with a tiny dash array, since [0.2, 0] is probably too small to be seen properly.
No, I was suggesting that if you really want to use a path pattern to render the link path as a dashed line, you should use a pattern that forms a dashed line. For example, you could just use the “Dash” pattern that is provided in the Custom Relationships sample.
Or you could define your own pattern, for example a copy of the “Dash” pattern but with a “blue” stroke.
Hi Walter,
I am trying to brush the adopted link.
Please check the below code and please correct it if I am wrong.
var color1 = “black”;
var color2 = “white”;
var gradBrush = $(go.Brush, “Radius”, {
0: color1, 1: color2
});
PathPatterns.add(“LegallyAdopted”, $(go.Shape,{geometryString: “M7 3 M3 0 L9 0 M3 3 L5 3”,stroke: brush, strokeWidth: 3,strokeDashArray: [20, 20]}));
I am getting the below output:
But I need as below :
Thanks,
Prameela.D
Hi Walter,
Anything I need to send please tell me. It is very urgent requirements. :(
Is there a reason why you are not using something like the “Dash” pattern from the Relationships sample?
I don’t understand why your code is doing what it is doing, because that will clearly not produce a simple dashed line.
Actually I am new to genogram to implement.
I used Dash pattern only from the Relationships sample.
PathPatterns.add(“NotLegallyAdopted”,$(go.Shape,{geometryString: “M0 0 M3 0 L6 0”,fill: “transparent”,stroke: “black”,strokeWidth: 1,strokeCap: “square”}));
In place of “Dash” I am using “NotLegallyAdopted” in the above code but geometryString: “M0 0 M3 0 L6 0” is for dash line only.
So it is displaying dash line but the thing is I should display the dash line like below screenshot:
But I am getting dotted horizontal line also as shown in below screenshot:
Please me because I am new to genogram.
Yes, that is the way that the Genogram sample was designed. All children are connected by links with the midpoint of the “marriage” link connecting the biological mother and father.
If a child is not below its “marriage” link, the link is going to have to extend horizontally. The link’s path shape (Link.path) is a single Shape, so it can have only one rendering along its path – it cannot change from a solid pattern to a dashed pattern at some arbitrary point along the way.
You mean to say, what I expected the requirement that is not doable. Is it correct?
Not the way that the Genogram sample was designed. That sample was designed for understanding the genetic relationships of various people. Adoptions (whether legal or informal) would not be considered.
I suppose you could design and implement something different. I know that many customers have done so, sometimes making dramatic changes. But I do not have their code and could not give it to you even if I did. And chances are high that you would have different requirements anyway. Every app is surprisingly different from each other.
Someday we will completely redesign and reimplement the Genogram sample, including the GenogramLayout, so that it better meets the needs of more customers. But not today.
I think in this case it’s possible to arrange the marriages so that they are wider than their collection of children. Then there would only need to be a straight link extending down from the “marriage” link to the child node. But I don’t know how well that will work with all of the other relationships that there might be with the parents or the children.