Rounded rectangle border selection adornment


I have a question about selection adornments. I have a rounded rectangle shape for my nodes and when selected, I would like to thicken the border from 1 to 3.

Here is a screenshot of my first step where the selection adornment is just rectangle.

When I switch the selection adornment shape to a rounded rectangle, some space gets added in which I assume is natural by default. Is there anyway to make the thicken border flushed with no spacing?

I did initially try before the selection adornment to have a binding on isSelected. I did get the desired look however there was an issue with undo/redo. It seems like with the binding approach, changing the border thickness on the node itself was leading to slight layout changes that had some sort of transaction involved and included in the undo stack.

new go.Binding('strokeWidth', 'isSelected', (s) => (s ? 3 : 1)).ofObject()

Any suggestions?


Each Shape has Shape.spot1 and Shape.spot2 properties that determine the rectangular area where the contents of the “Auto” Panel fit into the main element (i.e. the first element that acts as the border).
So you can set { spot1: go.Spot.TopLeft, spot2: go.Spot.BottomRight } in order to get rid of that padding within the “RoundedRectangle” Shape.

Yes, normally if a Node changes size it invalidates the Layout responsible for arranging that Node. You can disable that by setting Node.layoutConditions to a bit flag combination that does not include go.Part.LayoutNodeSized. Read more at: GoJS Layouts -- Northwoods Software

If you really want to change the Node that way you can, by having an always unseen border of the maximum thickness that does not change strokeWidth but instead changes stroke from null to “black” or whatever.