SVG和Canvas的区别

1）SVG：使用XML文档描述来绘图

图形类型：矢量图

操作对象：基于图形元素

元素：多个图形元素（Rect，Path，Line...）

驱动：支持脚本和css

适用场景：适合静态图片展示，高保真文档查看和打印的应用场景，适合用来做动态交互

性能：适合大面积，小数量应用场景

2）Canvas：使用JavaScript程序绘图(动态生成)

图形类型：位图

操作对象：基于像素（动态点阵图）

元素：单个canvas元素

驱动：只能脚本驱动

适用场景：适合像素处理，动态渲染和大数据量绘制，适合用来实现类似于Flash能做的事情，最适合图像密集型的游戏，其中的许多对象会被频繁重绘

性能：适合小面积，大数量应用场景