svg

一、SVG - 基础

1.svg简单介绍

 1) SVG是一种使用XML技术描述二维图形的语言,svg是一种矢量图

 2) 并不属于HTML5专有内容，在HTML5出现之前，就有SVG内容，HTML5只不过提供了SVG原生的内容

 3) svg文件的扩展名为.svg
 
          官网：
     http://www.chartjs.org

2. SVG的优势

 1）可通过文本编辑器来创建和修改

 2）可被搜索引擎搜索到

 3）SVG可在任何的分辨率下被高质量的打印

 4）可在图片质量不下降的情况下被放大

 5）支持事件绑定

3. SVG与canvas的区别

  SVG - 实际开发中，多用SVG

             不依赖分辨率
             支持事件处理器
             不适合游戏
             大型渲染区域的程序(例如，百度地图)
      
  Canvas

             依赖分辨率
             不支持事件绑定
             最适合网页游戏
             可以用图片格式保存图像


             不管是SVG还是Canvas，在一个页面中都可以同时定义多个

4.用途

             静态绘制图形
             动态动画效果
             专门提供事件

5.案例：canvas里引用chart.js制作饼状图

6.效果图

Paste_Image.png