一、什么是SVG
SVG是一种使用XML技术描述二维图形的语言,svg是一种矢量图，它并不属于HTML5专有内容，在HTML5出现之前，就有SVG内容，但是HTML5提供了SVG原生的内容，svg文件的扩展名为.svg
二、svg的优势
1）可通过文本编辑器来创建和修改
2）可被搜索引擎搜索到
v3）SVG可在任何的分辨率下被高质量的打印
4）可在图片质量不下降的情况下被放大
5）支持事件绑定
三、SVG与canvas的区别
svg不依赖像素，且支持事件处理，不适合做游戏，但适合做又大型渲染区域的程序（例如：百度地图）
canvas以来分辨率，不支持事件绑定，比较适合做网页游戏，可以用图片格式保存图像
但是不论是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 - 设置起点 折点及重点，x和y用逗号分隔，多个折点用空格隔开
6、多边形元素
<polygon points=""></polygon>
解决折线的这点显示问题
五、svg渐变
<svg>
<defs>
<linearGradient>
<stop>
</linearGradient>
</defs>
</svg>
efs里追加linearGradient元素，他才是真正实现渐变的元素,用stop标签来控制渐变颜色和范围
offset: 值为百分比
stop-color:设置渐变颜色
stop-opacity:设置渐变颜色的透明度
六、高斯模糊
