I’m trying to building a static Diagram with go.js (nodes and groups have fixed positions). My groups are in the desired spots but when I add a child node to one of them everything moves. How can I fix my layout? My js file
var goVar = go.GraphObject.make;
myDiagram =
goVar(go.Diagram, "myDiagramDiv",
{
isReadOnly: true,
initialAutoScale: go.Diagram.Uniform
});
myDiagram.nodeTemplate =
goVar(go.Node, "Auto",
new go.Binding("location", "loc", go.Point.parse),
goVar(go.Shape, "RoundedRectangle",
new go.Binding("fill", "color"),
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
),
goVar(go.TextBlock, "text",
{ margin: 10 },
new go.Binding("text", "key"),
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
)
)
myDiagram.groupTemplate =
goVar(go.Group, "Vertical",
goVar(go.Panel, "Auto",
goVar(go.Shape, "RoundedRectangle",
{
parameter1: 20,
fill: "rgba(0,0,0,0)",
strokeWidth: 3,
},
new go.Binding("stroke", "borderColor"),
),
new go.Binding("desiredSize", "size", go.Size.parse),
goVar(go.Placeholder,
{ padding: 5 })
),
goVar(go.TextBlock,
{ alignment: go.Spot.TopRight, font: "Bold 12pt Sans-Serif" },
new go.Binding("text", "key"),
new go.Binding("stroke", "borderColor"),
),
new go.Binding("position", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
);
jQuery.getJSON("data.json", load);
function load(jsondata) {
myDiagram.model = new go.GraphLinksModel(jsondata["nodes"], jsondata["links"]);
}