我目前正在react-native中创建一个应用程序，并使用react-native-svg来渲染形状，例如矩形，椭圆形等。

我将这些形状包含在宽高比为2：1的 SVG容器组件中：

• 形状的宽度是容器宽度的百分比。
• 形状的高度是容器高度的百分比。

我当前遇到一个无法解决的问题。 每次旋转形状时，都会以奇怪的方式扭曲和扭曲。

这里是一个旋转0度，宽度为60％，高度为30％的矩形：

这是旋转71度的相同矩形（宽度和高度与以前相同）：

我将矩形包裹在SVG组件中，如下所示： <Svg width="100%" height="100%" viewBox="0 0 100 100" preserveAspectRatio="none">

我尝试修改组件的preserveAspectRatio道具，但任何选择似乎都会扭曲形状的宽度和高度。

我所有的SVG形状组件使用大致相同的格式：

<Rect ... width={ attributes.width } height={ attributes.height } transform={ "rotate(" + attributes.rotation + " " + attributes.x + " " + attributes.y + ")" } />

我对它进行了编程，以使rotate()字符串产生，例如：rotate(71,30,55)。

有什么想法吗？