svg表盤實例

<?XML version="1.0" encoding="ISO-8859-1"?>
<!-- Generator: Adobe Illustrator 9.0, SVG Export Plug-In -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg>
<defs>
<filter id="metallic">
<feGaussianBlur result="blurredAlpha" in="SourceAlpha" stdDeviation="3"/>
<feOffset result="offsetBlurredAlpha" in="blurredAlpha" dx="2" dy="1"/>
<feDiffuseLighting result="bumpMapDiffuse" in="blurredAlpha" surfaceScale="5" diffuseConstant="0.5" >
<feDistantLight azimuth="135" elevation="60"/>
</feDiffuseLighting>
<feComposite result="litPaint" in="bumpMapDiffuse" Operator="arithmetic" k1="1" k2="0" k3="0" k4="0" in2="SourceGraphic"/>
<feSpecularLighting result="bumpMapSpecular" in="blurredAlpha" surfaceScale="5" specularConstant="0.5" specularExponent="10" >
<feDistantLight azimuth="135" elevation="60"/>
</feSpecularLighting>
<feComposite result="litPaint" in="litPaint" Operator="arithmetic" k1="0" k2="1" k3="1" k4="0" in2="bumpMapSpecular"/>
<feComposite result="litPaint" in="litPaint" Operator="in" in2="SourceAlpha"/>
<feMerge>
<feMergeNode in="offsetBlurredAlpha"/>
<feMergeNode in="litPaint"/>
</feMerge>
</filter>
</defs><circle cx="200" cy="200" r="130" />
<path d="M150,286 A100,100 0 1,1 250,286" />
<g>
<line x1="200" y1="100" x2="200" y2="115" />
<line x1="100" y1="200" x2="115" y2="200" />
<line x1="285" y1="200" x2="300" y2="200" />

<line x1="242.5" y1="126.4" x2="250" y2="113.5" />
<line x1="286.6" y1="150" x2="273.6" y2="157.5" />
<line x1="157.5" y1="126.4" x2="150" y2="113.5" />
<line x1="113.4" y1="150" x2="126.4" y2="157.5" />
<line x1="242.5" y1="273.6" x2="250" y2="286.6" />
<line x1="286.6" y1="250" x2="273.6" y2="242.5" />
<line x1="157.5" y1="273.6" x2="150" y2="286.6" />
<line x1="113.4" y1="250" x2="126.4" y2="242.5" /><text x="160" y="277" > -20 </text>
<text x="120" y="205" > 0 </text>
<text x="160" y="145" > 20 </text>
<text x="215" y="145" > 40</text>
<text x="265" y="205" > 60 </text>
<text x="230" y="277" > 80 </text>
<text id="xianshi"  x="160" y="370"> </text><line x1="299.45" y1="189.55" x2="289.55" y2="190.55" />
<line x1="297.8" y1="179" x2="288" y2="181" />
<line x1="295" y1="169" x2="285.6" y2="172" />
<line x1="291.4" y1="159" x2="282.2" y2="163.4" /><line x1="280.9" y1="141" x2="272.8" y2="147" />
<line x1="274.3" y1="133" x2="266.8" y2="139.8" />
<line x1="266.9" y1="125.7" x2="260.2" y2="133" />
<line x1="258.8" y1="119" x2="252.9" y2="127.2" /><line x1="240.7" y1="108.6" x2="236.6" y2="117.8" />
<line x1="230.9" y1="104.9" x2="227.8" y2="114.4" />
<line x1="220.8" y1="102.2" x2="218.7" y2="112" />
<line x1="210.5" y1="100.6" x2="209.4" y2="110.5" /><line x1="189.5" y1="100.5" x2="190.6" y2="110.5" />
<line x1="179.2" y1="102.2" x2="181.3" y2="112" />
<line x1="169.1" y1="104.9" x2="172.2" y2="114.4" />
<line x1="159.3" y1="108.7" x2="163.4" y2="117.8" /><line x1="141.2" y1="119.1" x2="147.1" y2="127.2" />
<line x1="133.1" y1="125.7" x2="139.8" y2="133.1" />
<line x1="125.7" y1="133.1" x2="133.1" y2="139.8" />
<line x1="119.1" y1="141.2" x2="127.2" y2="147.1" /><line x1="108.6" y1="159.3" x2="117.8" y2="163.4" />
<line x1="104.9" y1="169.1" x2="114.4" y2="172.2" />
<line x1="102.2" y1="179" x2="112" y2="181.3" />
<line x1="100.5" y1="189.5" x2="110.5" y2="190.6" /><line x1="100.5" y1="210.5" x2="110.5" y2="209.5" />
<line x1="102.2" y1="220.8" x2="112" y2="218.7" />
<line x1="104.9" y1="230.9" x2="114.4" y2="227.8" />
<line x1="108.6" y1="240.7" x2="117.8" y2="236.6" /><line x1="119.1" y1="258.8" x2="127.2" y2="252.9" />
<line x1="125.7" y1="266.9" x2="133.1" y2="260.2" />
<line x1="133.1" y1="274.3" x2="139.8" y2="266.9" />
<line x1="141.2" y1="280.9" x2="147.1" y2="272.8" />&lt;line x1="299.45" y1="210.5" x2="289.55" y2="209.5" />
<line x1="297.8" y1="220.8" x2="288" y2="218.7" />
<line x1="295" y1="230.9" x2="285.6" y2="227.8" />
<line x1="291.4" y1="240.7" x2="282.2" y2="236.6" /><line x1="280.9" y1="258.8" x2="272.8" y2="252.9" />
<line x1="274.3" y1="266.9" x2="266.8" y2="260.2" />
<line x1="266.9" y1="274.3" x2="260.2" y2="266.9" />
<line x1="258.8" y1="280.9" x2="252.9" y2="272.8" />
</g>
<g transform="translate(200,200)">
<g id="wendu">
<line x1="0" y1="0" x2="-50" y2="86" >
<animateTransform attributeName="transform" type="rotate"   dur="30s" />
</line>
</g>
</g>
<circle cx="200" cy="200" r="3" />
</svg>