一. SVG
- svg 是使用
XML描述的 2D 图形。 - 因为 svg 是基于 XML 的，所以 svg 中绘制图形还是使用的元素，所以 js 可以给元素添加事件！！
- svg 是矢量图，即是面向对象的图形，所以如果对象的属性发生改变，浏览器就会重新绘制图形！！
补充，矢量图：
- 在数学上定义为一系列由点连成的线，绘制成的图形元素称为对象，每个对象具有颜色、形状、大小、屏幕位置等属性！！
二. Canvas
- 通过 js 来绘制 2D图形。
- canvas 图像单位是像素。
- canvas 图像绘制完毕之后，浏览器将不再关注它，如果位置发生变换，就需要重新绘制。
三. 两者的比较
- svg 是一种矢量图，其不依赖于分辨率，而 canvas 依赖于分辨率。所以 svg 放大不会失真，但是 canvas 绘制的图形会失真。
- svg 支持事件处理器，而 canvas 不支持事件处理器。
- svg 中的文字独立于图像，文字可保留，可编辑和可搜索，canvas 的文本渲染能力弱。
- canvas 适合图像密集型的游戏，频繁地重绘图像，渲染性能高，适合游戏，svg 绘制的复杂度高时减慢渲染的速度，不适合游戏。
- canvas 绘制的图形可以多种格式 (jpg、png) 保存图片，但是 svg 绘制的只能以 .svg 格式保存，使用时可以引入 html 文件。
