首页风格
门户
博客

GBin1专题之HTML5教程 - 第九篇:HTML5 Canvas vs. SVG

日期:2012-4-24  来源:GBin1.com

俩者都可以在浏览器中创建图形,但是功能性上理解有什么区别呢?

SVG

SVG是一个用来使用XML来描述2D图形的语言。

SVG基于XML,这意味着每一个元素在SVG DOM中都是存在。你可以使用javascript来处理其中的元素。

在SVG中,每一个绘出的图形都被保存成一个对象。如果一个SVG的对象属性变化了,浏览器会自动的重新渲染图形形状。

Canvas

Canvas可以快速的开发2D图形(使用javascript)。

Canvas使用像素来渲染图形。

在Canvas中,一旦图形被绘制好了,就会被浏览器忽略。它的位置可以被移动,但是需要重新被绘制,包括任何图形包含的对象都需要被重新绘制。

Canvas和SVG比较

下表中比较了canvas和SVG的区别:

Canvas SVG
  • Resolution dependent
  • No support for event handlers
  • Poor text rendering capabilities
  • You can save the resulting image as .png or .jpg
  • Best suited for graphic-intensive games where many objects are redrawn frequently
  • Resolution independent
  • Support for event handlers
  • Best suited for applications with large rendering areas (Google Maps)
  • Slow rendering if complex (anything that uses the DOM a lot will be slow)
  • Not suited for game applications

 

来源:GBin1专题之HTML5教程 - 第九篇:HTML5 Canvas vs. SVG

喜欢我们的文章请您与朋友分享:

?ü?à

留言

友情提示: 本站博客不再支持访客留言,如果有问题或者留言,请发布到  GBtags.com

  1. 目前没有任何留言
今日推荐