矩形
rect
x:100;
y:100;
width:200px; 矩形的寬
height: 200px; 矩形的高
stroke:#000; 描邊顏色
fill:#f00; 填充顏色
stroke-width: 20; 描邊寬度
stroke-opacity:0.5; 描邊透明度
fill-opacity: 0.5; 填充透明度
圓形
circle
cx:400; 圓心x
cy:200; 圓心y
r:100; 半徑
stroke:#000; 描邊顏色
fill:#f90; 填充顏色
opacity:0.5; 透明度
stroke-width:20; 描邊寬度
橢圓
ellipse
cx:300; 圓心x
cy:300; 圓心y
rx:150; 橫向半徑
ry:100; 縱向半徑
stroke:#000; 描邊顏色
fill:#f90; 填充顏色
線
line
<line x1="100" y1="100" x2="400" y2="400" id="line1"></line>
x1:起點x
y1:起點y
x2:終點x
y2:終點y
stroke:#f90; 描邊顏色
stroke-width: 20; 描邊寬度
多邊形
polygon
<polygon points="200,10 250,190 160,210" fill="#f90"
stroke="#000"></polygon>
points:多邊形的幾個點
fill：填充顏色
stroke：描邊顏色
