年2月)HTML5依旧处于草案阶段。

HTML5支持网页端的多媒体功能和画布功能,追加了非常多全新的更合理的Tag标签。各个浏览器也都在逐渐的完好这些新的特性。

Canvas对象表示一个 HTML画布元素。如它的名字一样,它定义了一个API支持脚本化client来绘制图形或是图片,能够通过javascript来操作这些API。当然WebGL也是利用canvas来实现的。只是在此之前,先来简单的说明一下canvas。

年底,HTML5将成为一种完整的成品标准。

canvas标签的基础知识

canvas和img等标签一样。是一个能够自由制定大小的矩形区域。

通过javascript能够对矩形区域进行操作,能够自由的绘制图形,文字等。并且,能够加入影子,进行涂色,另外还能够对绘制的图形进行旋转等操作。并且,Web上经常使用的gif,jpg,png等格式的图片,也能够直接进行绘制。

可是,能够管理操作动画等处理的对象和方法是没有的。也就是说,为了制作动态的应用,一般会使用javascript进行循环处理。

在渲染速度上。因为javascript近几年的执行速度在不断的飞速上升,所以。假设不是特别复杂的应用的话。达到60FPS还是不成问题的。以下是我之前用canvas做的一个小游戏,如今把它贴出来。*已经上传到了jsdo.it。

没有使用WebGL。仅仅是利用了canvas一般的API。已经能够达到这样的程度了。尽管说实际执行的结果依赖于执行的环境。可是还是相当不错的吧。

WebGL和canvas

能够看到,使用canvas已经能够比較自由的绘制各种图形了。那么。为什么还要用WebGL来做处理呢?

实际上,刚才贴出来的jsdo.it上的那个小游戏,是利用了canvas的2d的context功能。

context是一个封装了画图处理的各种API的对象,这个对象中包括了全部的画图函数和属性,你能够把它想象成一个司令塔。一切的设定和处理命令都是由它发出的。

2d的context能够进行图形,文字以及图片数据的描画,可是也仅限于此,像它的名字一样,仅仅能用于2d空间的画图。

和这个相对的,WebGL是三维,能够描画3D图形,差别于之前的2dcontext,它叫做webglcontext。

webglcontext对象和2dcontext对象 一样,提供了各种各样的属性和方法,通过webglcontext。能够实现利用WebGL来描画图形。

总结

关于context,在我写这篇文章的时候,仅仅提供了2d和webgl两种定义。

可是webglcontext临时叫做experimental-webgl。以后,还有可能会出现新的类型,这个如今就不考虑了。

本站点的全部内容,都是使用WebGL来说明的,而2dcontext和今后出现的新的context,并没有打算去研究。(当然,也可能会出现一些2dcontext的内容......)

下次,開始介绍3d画图的基础知识。

转载请注明:转自lufy_legend的博客http://blog.csdn.net/lufy_legend

最新文章

  1. AngularJs的UI组件ui-Bootstrap分享(八)——Tooltip和Popover
  2. android中MVP模式
  3. 这些年正Android - 母亲
  4. C++学习 之const
  5. Session为null 问题
  6. SSIS包配置动态配置数据库连接
  7. cocos2dx windows phone平台下CCLabelTTF自己主动换行的实现(2)
  8. boost::thread boost库线程
  9. 这个知识点不错,,学习一下先。。。无状态服务(stateless service)(转)
  10. github中的ssh配置
  11. MVC是一种用于表示层设计的复合设计模式
  12. Vijos P1881 闪烁的星星
  13. 关于java socket(转)
  14. QuickBI助你成为分析师——计算字段功能
  15. Linux Mysql创建用户并分配权限
  16. Android 系统内核层与 Linux Kernel 的比较
  17. kali安装搜狗输入法
  18. Python 编程快速上手 第九章 组织文件
  19. golang学习资料[Basic]
  20. 如何不使用pthread_cancel而杀死线程

热门文章

  1. [原]Unity3D深入浅出 - 认识开发环境中的GameObject菜单栏
  2. 在Visual Studio 2010中使用DSL Tool特定领域开发 开篇
  3. UVa 1395 (最小生成树) Slim Span
  4. UVa 1363 (数论 数列求和) Joseph's Problem
  5. Wiz开发 定时器的使用与处理
  6. 自定义SharePoint列表新增、编辑、查看页面(NewForm、EditForm、DispForm)
  7. 序列化框架性能对比(kryo、hessian、java、protostuff)
  8. jvm常量池 vsv为什么1000 == 1000返回为False,而100 == 100会返回为True?
  9. POJ 2001-Shortest Prefixes(Trie 入门)
  10. ubuntu12.04 安装 chrome