Here is my node template :
myDiagram.nodeTemplate =
GO(go.Node,"Spot",
{ selectionObjectName: "SHAPE",
selectionAdorned: false,
movable:false,
locationSpot: go.Spot.Center,
rotatable: false,
resizable: false, resizeObjectName: "SHAPE",
layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized
},
new go.Binding("itemArray","spots"),
new go.Binding("angle", "ang").makeTwoWay(),
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
{
// each spot is represented by a Panel holding a circular Shape
// at a particular alignment relative to the "BODY"
itemTemplate:
GO(go.Panel,
GO(go.Shape, "Circle",
{
fill:"transparent",
strokeWidth: 0, width: 8, height: 8
},
{
toLinkable: true,
fromLinkable:true
},
new go.Binding("portId","portId")
),
new go.Binding("alignment", "spot", go.Spot.parse).makeTwoWay(go.Spot.stringify)
)
},
GO(go.Panel, "Auto",
GO(go.Shape,
{ name:"SHAPE",
cursor: "pointer",
// fill: "transparent",
desiredSize: new go.Size(70,70)
},
new go.Binding("figure","fig"),
new go.Binding("fill", "fill"),
new go.Binding("stroke", "stroke"),
new go.Binding("strokeWidth", "strokeWidth"),
new go.Binding("desiredSize", "size",go.Size.parse).makeTwoWay(go.Size.stringify)
)
),
GO(go.TextBlock,
{
font: "bold 14px sans-serif",
alignment: go.Spot.Bottom,
wrap: go.TextBlock.WrapFit,
stroke:"black",
editable: true
},
new go.Binding("text", "text").makeTwoWay(),
new go.Binding("stroke", "textcolor"),
new go.Binding("font", "fontstyle")),
);
Here is my grouptemplate:
myDiagram.groupTemplate =
GO(go.Group, "Auto",
{selectionAdorned:false,rotatable:false,resizable:false,resizeObjectName:"SHAPE",
locationObjectName: "SHAPE",ungroupable: true},
new go.Binding("location", "loc",go.Point.parse).makeTwoWay(go.Point.stringify),
GO(go.Panel, "Auto",
GO(go.Shape, "RoundedRectangle", // surrounds the Placeholder
{ name:"SHAPE",
parameter1:0,
fill: "rgba(255,255,255,0)",
// desiredSize:new go.Size(270, 200),
stroke:"transparent"
// minSize: new go.Size(270, 200)
}),
new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
GO(go.Placeholder, // represents the area of all member parts,
{ padding: 0}), // with some extra padding around them
GO(go.TextBlock,
{
font: "bold 14px sans-serif",
stroke:"black",
alignment: go.Spot.Bottom,
wrap: go.TextBlock.WrapFit,
editable: true
},
new go.Binding("font", "fontstyle"),
new go.Binding("text", "textname").makeTwoWay(),
new go.Binding("stroke", "textcolor"))
)
);
before flipping the diagram:

after flipping:
