Witten
Bainbridge
Nichols
HOME HELP PREFERENCES SEARCHFIGURESTABLES

Style properties used with basic shapes in SVG

 1 <?xml version="1.0" encoding="UTF-8"?>
 2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
      "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 3 <svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
 4  
 5   <title>Selection of SVG Shapes</title>
 6   <desc>Demonstration of rectangle, circle, and ellipse.</desc>
 7 
 8   <rect x="20"  y="20" width="120" height="80"/>
 9   <rect x="160" y="20" width="120" height="80" fill="none" stroke="black" />
10   <rect x="300" y="20" width="120" height="80" fill="none" stroke="red" 
        stroke-width="5"/>
11   <rect x="440" y="20" width="120" height="80" style="fill:none; 
        stroke-width:5; stroke:red"/>
12
13   <circle cx="80"  cy="200" r="60" fill="none" stroke="black" />
14   <circle cx="220" cy="200" r="60" fill="rgb(255,0,0)" stroke="black" />
15
16   <ellipse cx="360" cy="200" rx="60" ry="40"/>
17   <ellipse cx="500" cy="200" rx="60" ry="40" stroke="black" fill="none" 
        stroke-dasharray="5,3"/>
18
19 </svg>

Figure 5.17b: Style properties used with basic shapes in SVG; Underlying XML