Give rounded corner to textblock

@ozairsajid wrote:

Hi,

We would like to give rounded corner to textblock. Is this possible?
Below is the current template:

Screen Shot 2018-11-26 at 4.24.26 PM.png1492x334 62 KB

const groupExpandedTemplate =
        $(go.Group, 'Spot',
            {
                selectionAdornmentTemplate: // adornment when a group is selected
                    $(go.Adornment, 'Auto',
                        $(go.Shape, 'RoundedRectangle',
                            { fill: null, stroke: 'dodgerblue', strokeWidth: 3 }),
                        $(go.Placeholder)
                    ),
                computesBoundsAfterDrag: true,  // needed to prevent recomputing Group.placeholder bounds too soon
                computesBoundsIncludingLinks: false,  // to reduce occurrences of links going briefly outside the lane
                computesBoundsIncludingLocation: true,  // to support empty space at top-left corner of lane
                // subGraphExpandedChanged: function (grp) { grp.category = 'collapsed'; },
                toSpot: go.Spot.TopLeft, // links coming into groups at any side
                fromSpot: go.Spot.TopCenter,
                toEndSegmentLength: 30, // fromEndSegmentLength: 30
            },
            // new go.Binding('isSubGraphExpanded').makeTwoWay(),
            $(go.Panel, 'Auto',
                $(go.Shape, 'RoundedRectangle',
                    {
                        name: 'OBJSHAPE',
                        parameter1: 14,
                        opacity: .1
                    },
                    new go.Binding('fill', 'color'),
                    new go.Binding('desiredSize', 'ds')),

                $(go.Panel, 'Vertical',  // title above Placeholder
                    $(go.Panel, 'Horizontal',  // button next to TextBlock

                        { stretch: go.GraphObject.Horizontal },
                        $('SubGraphExpanderButton',
                            { alignment: go.Spot.Left, margin: 5 }),
                        $(go.TextBlock,
                            {
                                alignment: go.Spot.Left,
                                editable: true,
                                margin: 5,
                                font: 'bold 15px sans-serif',
                                opacity: 0.75,
                                stroke: 'white'
                            },
                            new go.Binding('text', 'name')
                        ),
                        new go.Binding('background', 'color')
                    ),  // end Horizontal Panel

                    $(go.Placeholder,
                        { padding: 5, alignment: go.Spot.TopLeft })
                )
            )
        );

We would like to achieve something like below:

Screen Shot 2018-11-26 at 4.27.28 PM.jpg1484x490 66.4 KB

We are using gojs@1.8.32.

Posts: 2

Participants: 2

Read full topic