canvas和SVG可以在浏览器绘制图形,但是本质上是不同的。canves是绘制2d图象,SVG也是绘制2d图象。
Canvas是Javascript进行绘图的,是逐像素绘图。Canvas一旦图象绘制完成,就于浏览器无关了,图象的位置发生变化,整个场景都需要重新重新绘制,包括已经被覆盖的元素。
svg是使用xml绘制,可以为svg添加javascript的事件处理器。所有的DOM都是可用的,属性发生变化,浏览器会自动重新绘制。
SVG和Canvas的不同:
svg支持事件处理器,而Canvas不支持;
svg是通过XML定义的,而Canvas是通过javascript定义的。
Canvas可以保存为png或者jpg格式;
Canvas适合游戏场景绘图,很多对象需要频繁重绘,而SVG不适合游戏场景绘图;
Canvas支持分辨率,SVG不支持分辨率;
Canvas弱文本渲染能力,SVG适合带有大型渲染区域的应用程序;
SVG复杂度高会减慢绘图速度。