Hi Walter,
I am using different link templates because of using different link shapes like legally adopted, living together, biological child and twins.
Below is my code for different templates
Marriage :
myDiagram.linkTemplateMap.add("Marriage",
$(go.Link,
{ isTreeLink: false,selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:true,curve: go.Link.JumpGap ,segmentFraction: 0.5,layerName: "Background"},//,layerName: "Background"
$(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,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"))
));
legally adopted and living together:
myDiagram.linkTemplateMap.add("NewLinkFormats",
$(go.Link, {selectable: false, routing: go.Link.AvoidsNodes,isLayoutPositioned:true,curve: go.Link.JumpGap,segmentFraction: 0.15 ,layerName: "Background"},//,layerName: "Background"
$(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"))
)) ;
Biological Child:
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(60, -60) }, new go.Binding("text", "relationText")),
$(go.TextBlock, { margin: -2,alignment: go.Spot.Top,segmentOffset: new go.Point(0, -10)}, new go.Binding("text", "srelationText"))
));
Twins:
myDiagram.nodeTemplateMap.add("TwinLinkLabel",
$(go.Node, { segmentIndex: -2, segmentFraction: 0.5, selectable: false, width: 1, height: 1, isLayoutPositioned: false }));
myDiagram.linkTemplateMap.add("Twin", // for connecting twins/triplets
$(go.Link, { selectable: false, isLayoutPositioned:true,curve: go.Link.JumpGap,segmentFraction: 0.5 ,layerName: "Background" },
$(go.Shape, { strokeWidth: 2, stroke: "blue" }),
$(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"))
));
For twins, I am using the below function:
function TwinDrawingTool() {
go.LinkingTool.call(this);
}
go.Diagram.inherit(TwinDrawingTool, go.LinkingTool);
TwinDrawingTool.prototype.findLinkablePort = function() {
var diagram = this.diagram;
if (diagram === null) return null;
var obj = this.startObject;
if (obj === null) {
obj = diagram.findObjectAt(diagram.firstInput.documentPoint, null, null);
}
if (obj === null) return null;
var node = obj.part;
if (!(node instanceof Node)) return null;
// require the node to have parents and siblings
var parentMarriageNode = node.findTreeParentNode();
if (parentMarriageNode === null) return null;
if (parentMarriageNode.findTreeChildrenLinks().count <= 1) return null;
return node.port;
};
TwinDrawingTool.prototype.isValidTo = function(tonode, toport) {
if (tonode === null || toport === null) return false;
if (tonode.data.birth !== undefined) return false; // already a twin?
if (tonode === this.originalFromNode) return false; // not to itself!
// require both the fromnode and the tonode to have the same marriage (label) parent node
return this.originalFromNode.findTreeParentNode() === tonode.findTreeParentNode();
};
TwinDrawingTool.prototype.insertLink = function(fromnode, fromport, tonode, toport) {
var diagram = this.diagram;
if (diagram === null) return null;
var fromParentLink = fromnode.findTreeParentLink();
var toParentLink = tonode.findTreeParentLink();
// assert
if (fromParentLink === null || toParentLink === null || fromParentLink.fromNode !== toParentLink.fromNode) {
throw new Error("this should never happen");
}
var commonParent = fromParentLink.fromNode;
var model = diagram.model;
// make sure the parent link of the fromnode has a label node; create it if needed
var fromParentLabelNode = fromParentLink.labelNodes.first();
var fromLabelData = null;
if (fromParentLabelNode === null) {
fromLabelData = { };
model.setCategoryForNodeData(fromLabelData, "TwinLinkLabel");
model.addNodeData(fromLabelData); // assigns key
model.addLabelKeyForLinkData(fromParentLink.data, model.getKeyForNodeData(fromLabelData));
} else {
fromLabelData = fromParentLabelNode.data;
}
// make sure the parent link of the tonode has a label node; create it if needed
var toParentLabelNode = toParentLink.labelNodes.first();
var toLabelData = null;
if (toParentLabelNode === null) {
toLabelData = { };
model.setCategoryForNodeData(toLabelData, "TwinLinkLabel");
model.addNodeData(toLabelData); // assigns key
model.addLabelKeyForLinkData(toParentLink.data, model.getKeyForNodeData(toLabelData));
} else {
toLabelData = toParentLabelNode.data;
}
// now that both label nodes exist, add a TwinLink between them
var twinLinkData = {};
model.setCategoryForLinkData(twinLinkData, "Twin");
model.setFromKeyForLinkData(twinLinkData, model.getKeyForNodeData(fromLabelData));
model.setToKeyForLinkData(twinLinkData, model.getKeyForNodeData(toLabelData));
model.addLinkData(twinLinkData);
// make sure "birth" is set on both nodes
if (fromnode.data.birth === undefined) {
// how many sets of twins/triplets does this marriage have already?
var maxBirth = 0;
commonParent.findTreeChildrenNodes().each(function(n) {
if (n.data.birth !== undefined) {
maxBirth = Math.max(maxBirth, n.data.birth);
}
})
model.setDataProperty(fromnode.data, "birth", maxBirth + 1);
}
model.setDataProperty(tonode.data, "birth", fromnode.data.birth);
return diagram.findLinkForData(twinLinkData);
};
But displaying as below screenshot:
But I need twins to display as below with child 4 and child 5(which is not displaying text child 4 and child 5):
Thanks,
Prameela.D