不同点：1、画布依赖分辨率，而SVG不依赖分辨率；2、画布不支持事件处理器，SVG支持事件处理器；3、画布适合图像密集型的游戏应用，SVG不适合游戏应用；4、svg是通过XML定义的，而Canvas是通过javascript定义的。

创新互联公司是一家集网站建设,常山企业网站建设,常山品牌网站建设,网站定制,常山网站建设报价,网络营销,网络优化,常山网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

本教程操作环境：windows7系统、HTML5版、Dell G3电脑。

Canvas（画布）是Javascript进行绘图的，是逐像素绘图。Canvas一旦图象绘制完成，就于浏览器无关了，图象的位置发生变化，整个场景都需要重新重新绘制，包括已经被覆盖的元素。

svg是使用xml绘制，可以为svg添加javascript的事件处理器。所有的DOM都是可用的，属性发生变化，浏览器会自动重新绘制。

SVG和Canvas的不同：

Canvas（画布）

依赖分辨率

不支持事件处理器

弱的文本渲染能力

能够以 .png 或 .jpg 格式保存结果图像

最适合图像密集型的游戏，其中的许多对象会被频繁重绘

Canvas是通过javascript定义的。

SVG

不依赖分辨率

支持事件处理器

最适合带有大型渲染区域的应用程序（比如谷歌地图）

复杂度高会减慢渲染速度（任何过度使用 DOM 的应用都不快）

不适合游戏应用

svg是通过XML定义的

相关推荐：《html视频教程》

标题名称：html5画布和svg的不同有哪些
转载来源：http://lswzjz.com/article/cjgded.html