canvas与svg的区别

Canvas

1. canvas通过javascript来绘制2D图形。

2. canvas是逐个像素进行渲染。

3. 在canvas中，图形绘制完成后，它就不会继续得到浏览器的关注。如果位置、大小等发生变化，那么整个canvas场景也需要重新绘制，根据变化不同，会产生一定程度的重排或重绘。

4. canvas绘制的图片依赖分辨率，能够以.png .jpg格式保存存储图像

5. canvas不支持事件处理，所绘制的图形都在画布中，不能用js获取图形元素，canvas适用于对象要被频繁绘制的图形中，例如图形密集型游戏。

6. 典型的canvas图形库是echarts。

SVG

1.SVG是一种使用XML描述2D图形的语言。

2. SVG基于XML，通过生成DOM进行图形渲染。

3. 在SVG中，每个被绘制的图形均被视为对象，如果SVG对象的属性发生变化，浏览器能够自动重绘图形。

4. SVG绘制的图片不依赖分辨率，所绘制的图形属于矢量图。

5. SVG支持事件处理，每个图形都是以DOM节点的形式插入到页面中，可以用js或其他方法直接操作，适用于有大型渲染区域的应用程序，例如地图。还有设计用于高分辨率打印图像的程序，以及计算机辅助制图程序。

6. 典型的SVG图形库是highCharts

标签：canvas,区别,svg,渲染,SVG,图形库,图形,绘制
来源： https://www.cnblogs.com/masha2017/p/16181531.html