1凰萨、cycle
(1)cx cy r
(2)fill stroke stroke-width transparent
(3) style方式
2夭织、rect
(1)width height x y
(2) rx ry
3鳞青、line
(1)x1 x2 y1 y2
(2)stroke-opacity
4、<g>標(biāo)簽
是一個(gè)容器標(biāo)簽戈咳，用來(lái)組合元素的
（1）只對(duì)于所有圖形共有的屬性起作用耳高，例如stroke fill等屬性
（2）但是對(duì)于各個(gè)圖形特有的屬性，<g>標(biāo)簽不能使用颗祝，但是可以使用transform:tanslate(0,0)來(lái)實(shí)現(xiàn)平移
<g transform="translate(0,0)" stroke-width="5" stroke="red">
<circle r="40" fill="transparent"></circle>
<circle r="30" fill="transparent"></circle>
<circle r="20" fill="transparent"></circle>
</g>
5浊闪、<text>標(biāo)簽
在svg中添加文本
（1）x y text-anchor
6、<image>標(biāo)簽
（1）x y widht height
（2）xlink:href
7螺戳、創(chuàng)建SVG標(biāo)簽
var svgNS='http://www.w3.org/2000/svg'
var oSVG=document.createElementNS(svgNS,'svg');
oSVG.setAttribute('xmls',svgNS);
oSVG.setAttribute('width':100%);
oSVG.setAttribute('height':100%);
var parent=document.getElementById('');
parent.appendChild(oSvg);
8搁宾、一個(gè)創(chuàng)建SVG標(biāo)簽封裝
var svgNS='http://www.w3.org/2000/svg'
var oSVG=document.getElementById("svgContent");
function createTag(tag,objectAttributes){
var tag=document.createElementNS(svgNS,tag);
for(var key in objectAttributes){
// tag[key]=objectAttributes[key];
tag.setAttribute(key,objectAttributes[key])
}
return tag;
}
var svg=createTag('svg',{
"xmlns":"svgNS",
"width":"100%",
"height":"100%"
});
var g=createTag('g',{
"style":"cursor:pointer"
})
var line1=createTag('line',{
"x1":"100",
"y1":"100",
"x2":"390",
"y2":"200",
"stroke":"#ACD2DE"
})
var line2=createTag('line',{
"x1":"100",
"y1":"100",
"x2":"390",
"y2":"200",
"stroke":"transparent",
"stroke-width":"6",
})
var rect=createTag('rect',{
"x":"235",
"y":"140",
"width":"20",
"height":"20",
"fill":"#999",
"rx":"5"
})
var text=createTag("text",{
"x":"245",
"y":"157",
"fill":"white",
"font-size":"20",
"text-anchor":"middle"
})
oSVG.appendChild(svg);
svg.appendChild(g);
text.innerHTML="?";
g.appendChild(line1);
g.appendChild(line2);
g.appendChild(rect);
g.appendChild(text);
9、折線
polyline：折線
point: 空格（逗號(hào)）來(lái)隔開(kāi)坐標(biāo)點(diǎn)
10倔幼、路徑標(biāo)簽
path 通過(guò)繪制坐標(biāo)點(diǎn)形成一個(gè)想要的圖形盖腿，
-d屬性
M L H V A Z
C S Q T
M（起點(diǎn)位置，如果在路徑中重新設(shè)置一個(gè)损同，則有一個(gè)新的起點(diǎn)）
L（終點(diǎn)位置翩腐，如果在路徑中重新設(shè)置一個(gè) ，則會(huì)繼續(xù)延伸）
Z（閉合位置揖庄，如果出現(xiàn)在一個(gè)有M L構(gòu)成路徑中栗菜，則Z前面的路徑會(huì)閉合）
H（水平繪制，例如M50 100H200蹄梢，H只用寫(xiě)一個(gè)坐標(biāo)值疙筹，因?yàn)樗嚼L制Y坐標(biāo)肯定是已知的。V同理）
如果換成小寫(xiě)禁炒，就是相對(duì)之前操作點(diǎn)的相對(duì)坐標(biāo)而咆。
A（繪制一段弧形
x半徑：
Y半徑：
角度：
弧長(zhǎng)：（0小弧，1大荒桓ぁ）
方向：（0逆時(shí)針暴备，1順時(shí)針）
終點(diǎn)X坐標(biāo)：
終點(diǎn)Y坐標(biāo)：
）
