Problems when applying react-konva rotation

Question

I want to move the shape and change the direction using the arrow key. Moving was successful. But When 'rotation' is applied, the 'text' position changes. How do I keep the text position and only change the orientation of the shape?

https://codesandbox.io/s/modern-dew-d3d8em?file=/src/App.js

Answer 1

You need to put the pivot point in the center of the figure and center the text too

<Circle
 ...
 offsetY={SIZE / 2} 
 offsetX={SIZE / 2}
/>

and