Add Adornment to Group

GoJS
1

Hi. In the Planogram sample when the rack is full of items, you can no longer select and move the rack. Is there a way to add an adornment / button to the outside of the group so a user can select and drag the rack around?

myDiagram.groupTemplate.selectionAdornmentTemplate =
$(go.Adornment, “Spot”,
$(go.Panel, “Auto”,
$(go.Shape, { stroke: “dodgerblue”, strokeWidth: 2, fill: null }),
$(go.Placeholder)
),
$(go.Panel, “Horizontal”,
{ alignment: go.Spot.Top, alignmentFocus: go.Spot.Bottom },
$(“Button”,
{ click: null }, // move group template?
$(go.TextBlock, “Rack Name”,
{ font: “bold 10pt sans-serif”, editable: true, textAlign: “left” },
new go.Binding(“text”, “text”).makeTwoWay()) //cannot edit text?
)
)
);

Desired result looks something like this (editable and draggable rack label):

Many thanks.

2

Sure, just add it to your Group template. It’s trivial to make the text editable, but I would not think you would want users moving it. They might lose it. Also users couldn’t move the group when only the label “tab” is visible.

I also suggest that you implement a mouseEnter event handler on the group and on all nodes that might be members of the group. That’s just to re-order the Group to be at the front of the Layer holding all of the groups and member nodes. Otherwise the label “tab” might be behind an adjacent group.

These reasons why I think it would be better to have the label “tab” in the Group template rather than in the group Adornment.