HTML 5 Canvas vs. SVG | 蓝文资源库 – 海量优质开发设计资源分享平台

Canvas 和 SVG 都允许您在浏览器中创建图形，但是它们在根本上是不同的。

SVG

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

SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。

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

Canvas 通过 JavaScript 来绘制 2D 图形。

Canvas 是逐像素进行渲染的。

在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。

下表列出了 canvas 与 SVG 之间的一些不同之处。

1 本资源来源于互联网，资源的版权归资源原作者所持有，受《中华人民共和国著作权法》等相关法律保护。

2 由于无法和原作者取得联系，所以上传的部分资源无法先通过原作者的同意就分享给大家了，如本资源侵犯了您（原作者）的权益，请联系我们（微信号 xiaohaimei1989），我们会立马删除您的资源，并向您表达诚挚的歉意！

3 本站是一个公益型网站，分享资源的目的在于传播知识，分享知识，收取一点点打赏的辛苦费是用于网站的日常运营开支，并非用于商业用途。

4 本站资源只提供学习和参考研究使用，使用过后请在第一时间内删除。本站不承担资源被单位或个人商用带来的法律责任。