2
<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
3
width="400px" height="120px">
5
<desc>Example RotateScale - Rotate and scale transforms</desc>
7
<g fill="none" stroke="black" stroke-width="3">
8
<!-- Draw the axes of the original coordinate system -->
9
<line x1="0" y1="1.5" x2="400" y2="1.5"/>
10
<line x1="1.5" y1="0" x2="1.5" y2="120"/>
12
<!-- Establish a new coordinate system whose origin is at (50,30)
13
in the initial coord. system and which is rotated by 30 degrees. -->
14
<g transform="translate(50,30)">
15
<g transform="rotate(30)">
16
<g fill="none" stroke="red" stroke-width="3">
17
<line x1="0" y1="0" x2="50" y2="0"/>
18
<line x1="0" y1="0" x2="0" y2="50"/>
20
<text x="0" y="0" font-size="20" font-family="Verdana" fill="blue">
25
<!-- Establish a new coordinate system whose origin is at (200,40)
26
in the initial coord. system and which is scaled by 1.5. -->
27
<g transform="translate(200,40)">
28
<g transform="scale(1.5)">
29
<g fill="none" stroke="red" stroke-width="3">
30
<line x1="0" y1="0" x2="50" y2="0"/>
31
<line x1="0" y1="0" x2="0" y2="50"/>
33
<text x="0" y="0" font-size="20" font-family="Verdana" fill="blue">