Here’s my code. Note that I have no idea of what link validation policies you want to implement. GoJS Validation -- Northwoods Software
function init() {
var $ = go.GraphObject.make;
myDiagram =
$(go.Diagram, "myDiagramDiv",
{
layout: $(go.TreeLayout, {
setsPortSpot: false,
setsChildPortSpot: false,
assignTreeVertexValues: function(v) {
if (v.node && v.node.category === "Big") v.layerSpacing = 25;
}
}),
"undoManager.isEnabled": true
});
myDiagram.nodeTemplateMap.add("Little",
$(go.Node, "Vertical",
{ locationSpot: go.Spot.Center, locationObjectName: "ICON" },
$(go.Shape,
{ name: "ICON", fill: "greenyellow", strokeWidth: 0, width: 40, height: 40,
portId: "", fromSpot: go.Spot.Right, toSpot: go.Spot.Left,
fromLinkable: true, toLinkable: true }),
$(go.TextBlock,
{ margin: 2 },
new go.Binding("text"))
));
myDiagram.nodeTemplateMap.add("Big",
$(go.Node, "Spot",
{ locationSpot: go.Spot.Center, locationObjectName: "ICON" },
$(go.Shape, "RoundedRectangle",
{ fill: "dodgerblue", strokeWidth: 0, width: 120, height: 120 }),
$(go.Panel, "Vertical",
{ alignment: new go.Spot(0.5, 0, 0, 50) },
$(go.Shape,
{ name: "ICON", fill: "greenyellow", strokeWidth: 0, width: 40, height: 40,
portId: "", fromSpot: new go.Spot(1, 0.5, 40, 0), toSpot: new go.Spot(0, 0.5, -40, 0),
fromLinkable: true, toLinkable: true }),
$(go.TextBlock,
{ margin: 2, stroke: "white" },
new go.Binding("text"))
)
));
myDiagram.nodeTemplateMap.add("Circle",
$(go.Node,
{ locationSpot: go.Spot.Center, fromSpot: go.Spot.Right, toSpot: go.Spot.Left,
fromLinkable: true, toLinkable: true },
$(go.Shape, "Circle",
{ width: 16, height: 16, fill: "transparent", stroke: "lightgray", strokeWidth: 3 })
));
myDiagram.linkTemplate =
$(go.Link,
{ routing: go.Link.AvoidsNodes, corner: 10 },
$(go.Shape, { stroke: "lightgray", strokeWidth: 3 })
);
myDiagram.model = new go.GraphLinksModel(
[
{ key: 1, text: "Alpha", category: "Little" },
{ key: 2, text: "Beta", category: "Big" },
{ key: 3, text: "Gamma", category: "Circle" },
{ key: 4, text: "Delta", category: "Circle" },
{ key: 5, text: "Epsilon", category: "Circle" },
{ key: 6, text: "Zeta", category: "Circle" },
{ key: 7, text: "Eta", category: "Circle" }
],
[
{ from: 1, to: 2 },
{ from: 1, to: 3 },
{ from: 1, to: 4 },
{ from: 1, to: 5 },
{ from: 1, to: 6 },
{ from: 2, to: 7 }
]);
}