SkectViewModel how draw Circle/Rectangle With Text in center of the geometry

[SaihaniIdaffieSaidin]

Hi kindly please help,

I am new to the ArcGis.

How can I achieve the objective of combining a circle or rectangle shape with text, where both the shape and text can be selected together for editing (including changing position and resizing), using the SkecthViewModel? Alternatively, are there any other methods or approaches that can help me accomplish this goal?

      this.sketchVM = new SketchViewModel({

        view: this._view,

        layer: this.graphicsLayer

      });

      this.sketchVM.polygonSymbol.outline.color = 'red';

      console.log('skvm', this.sketchVM)

      // this.sketchVM.create(type);

      this.sketchVM.create(type);

      this.sketchVM.on('create' ,(event:any) =>{

       if(event.state === 'complete'){

           const texSymbol = new TextSymbol({

          text: 'test',

          color:  'red',

          font: {

            family: "Arial Unicode MS",

            size: 30

          }

        });

        const graphic = new Graphic({

          geometry: event.graphic.geometry,

          symbol: texSymbol

        });

        console.log('graphic',graphic)

        console.log('last',this.graphicsLayer.graphics.add(graphic))

        this.graphicsLayer.graphics.add(graphic);

       }

      })