Source of transform.svg
<svg>
<desc>
I'll define a shape to transform
</desc>
<defs>
<rect id = "myRect"
x = "10"
y = "10"
height = "50"
width = "50"
stroke-width = "2px"
stroke = "red"
fill = "blue" />
</defs>
<g>
<desc>
First version leaves it alone
</desc>
<use xlink:href = "#myRect" />
</g>
<g transform = "translate(100,30)">
<desc>
The transform attribute allows you to change a shape
translate moves the object
</desc>
<use xlink:href = "#myRect" />
</g>
<g transform = "translate(200, 0) rotate(45)">
<desc>
This second square is rotated 45 degrees
</desc>
<use xlink:href = "#myRect" />
</g>
<g transform = "translate(300, 0) scale(2)">
<desc>
This square is twice the default size
</desc>
<use xlink:href = "#myRect" />
</g>
<g transform = "translate(0, 100) skewX(30)">
<desc>
skew the square along the X axis
</desc>
<use xlink:href = "#myRect" />
</g>
</svg>