轉型

可以通過新增 transform 屬性來更改圖形元素。

<svg xmlns="http://www.w3.org/2000/svg">
    <rect x="0" y="0" width="30" height="30" transform="translate(10, 10)" />
</svg>

而不是在座標（0,0）處渲染左上角原點，而是從點（10,10）向下和向右顯示。

整組元素可以一起轉換，轉換可以相互新增。

<svg xmlns="http://www.w3.org/2000/svg">
    <g transform="rotate(45)">
        <rect x="0" y="0" width="30" height="30" />
        <circle cx="5" cy="5" r="5" transform="scale(3)" />
    </g>
</svg>

首先，圓的每個點將使用因子 3 相對於原點進行縮放，使圓的中心位於（15,15）矩形的中間，半徑為 15.然後，矩形和圓圈將圍繞原點順時針旋轉 45 度。