作者:花颖年华 | 来源:互联网 | 2020-09-08 20:03
本章给大家介绍html5中的Canvas 和 SVG分别是什么?它们的区别在何处?有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
一、什么是Canvas ?
Canvas 是指定了长度和宽度的矩形画布,我们将使用新的HTML5 Javascript,可使用HTML5 JS API 来画出各种图形。不过,canvas本身并没有绘制能力(它仅仅是图形的容器) - 您必须使用脚本来完成实际的绘图任务。
Canvas 实例代码:创建画布,然后再画布上绘一个圆形
效果图:
SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
SVG实例代码:
效果图:
支持事件处理器
最适合带有大型渲染区域的应用程序(比如谷歌地图)
复杂度高会减慢渲染速度(任何过度使用 DOM 的应用都不快)
不适合游戏应用
Canvas
Canvas 通过 Javascript 来绘制 2D 图形。
Canvas 是逐像素进行渲染的。
在 canvas 中,一旦图形被绘制完成,它就不会继续得到浏览器的关注。如果其位置发生变化,那么整个场景也需要重新绘制,包括任何或许已被图形覆盖的对象。
特点:
依赖分辨率
不支持事件处理器
弱的文本渲染能力
能够以 .png 或 .jpg 格式保存结果图像
最适合图像密集型的游戏,其中的许多对象会被频繁重绘
以上就是html5中的Canvas 和 SVG分别是什么?它们的区别在何处?(实例)的详细内容,更多请关注 第一PHP社区 其它相关文章!