一、什么是SVG
SVG是一種使用XML技術(shù)描述二維圖形的語言,svg是一種矢量圖，它并不屬于HTML5專有內(nèi)容，在HTML5出現(xiàn)之前，就有SVG內(nèi)容，但是HTML5提供了SVG原生的內(nèi)容，svg文件的擴展名為.svg
二、svg的優(yōu)勢
1）可通過文本編輯器來創(chuàng)建和修改
2）可被搜索引擎搜索到
v3）SVG可在任何的分辨率下被高質(zhì)量的打印
4）可在圖片質(zhì)量不下降的情況下被放大
5）支持事件綁定
三、SVG與canvas的區(qū)別
svg不依賴像素，且支持事件處理，不適合做游戲，但適合做又大型渲染區(qū)域的程序（例如：百度地圖）
canvas以來分辨率，不支持事件綁定，比較適合做網(wǎng)頁游戲，可以用圖片格式保存圖像
但是不論是svg還是canvas，他們在一個頁面中都可以定義多個
四、用svg來繪制圖形
使用svg繪制圖形，必須定義svg元素，<svg></svg>
1、矩形
<rect x="" y="" width="" height="" ></rect>
2、圓形
<circle cx="" cy="" r=""></circle>
3、橢圓形
<ellipse cx="" cy="" rx="" ry=""></ellipse>
4、直線
<line x1="" y1="" x2="" y2=""></line>
5、折線
<polyline points=""></polyline>
points - 設(shè)置起點 折點及重點，x和y用逗號分隔，多個折點用空格隔開
6、多邊形元素
<polygon points=""></polygon>
解決折線的這點顯示問題
五、svg漸變
<svg>
? ? ? ? ? <defs>
<linearGradient>
<stop>
</linearGradient>
? ? ? ? ? </defs>
</svg>
efs里追加linearGradient元素，他才是真正實現(xiàn)漸變的元素,用stop標簽來控制漸變顏色和范圍
offset: 值為百分比
stop-color:設(shè)置漸變顏色
stop-opacity:設(shè)置漸變顏色的透明度
六、高斯模糊
