OpenGL和WebGL基本概念

OPEN GL:一个跨编程语言、跨平台的编程接口规格的专业的图形程序接口。它用于三维图像(二维的亦可),是一个功能强大,调用方便的底层图形库。

WebGL:›一个3D图形标准›融合了Javascript和OPEN GL ES2.0›为HTML5 Canvas提供了硬件3D加速渲染Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了,还能创建复杂的导航和数据视觉化

OpenGL是一个底层库,他是一个和语言和平台无关图形程序接口(包括二维和三维)可以有多种实现方式,而WebGL则是跟Web有关,是一个Web层面的标准,在WebGL标注下,我们可以通过javascript来实现调用OpenGL等底层图形库进行三维动画制作,是不是相当cool

当然目前由于硬件的限制,Web层面的三维动画开发才刚刚开始,也许几年之后硬件有了很大的发展,说不定WebGL会火热起来

他们之间的关系如上所示

WebGL的特点

1. WebGL最大的特点就是他是浏览器自带的标准,也就是不需要安装任何插件和组件,不同于flash和siverlight,这对于他来说是一个很大的优势

2. 其次WebGL通过统一的、标准的、跨平台的OpenGL接口实现,从而可以利用底层的图形硬件加速功能进行的图形渲染

支持情况

从图中可以看到,Webkit浏览器基本都是支持的,IE直到11才开始支持

效果展示

三维动画说展现出来的效果比二维动画要丰富的很多,甚至惊艳来形容:

›TankWorld :一个Web三维坦克游戏
›Clouds:一个云雾效果
›HelloRacerWebGL:一个方程式赛车游戏
›Google Body Browser:google人体解剖
›pearl boy:一个场景
›http://helloracer.com/racer-s/:一个非常酷的赛车效果

开发框架:

WebGL常见的开发框架如Three.js,目前寄托于https://github.com/mrdoob/three.js,目前比较火热,但是中文文档比较少,官网http://threejs.org 截图如下:

【WebGL】1.WebGL简介的更多相关文章

  1. WebGL 入门-WebGL简介与3D图形学

    什么是WebGL? WebGL是一项使用JavaScript实现3D绘图的技术,浏览器无需插件支持,Web开发者就能借助系统显卡(GPU)进行编写代码从而呈现3D场景和对象. WebGL基于OpenG ...

  2. CSGrandeur的WebGL学习——WebGL教程

    在线查看:http://csgrandeur.gitbooks.io/webgl-learn/content/ 离线mobi:http://files.cnblogs.com/files/CSGran ...

  3. Javascript高级编程学习笔记(98)—— WebGL(4) WebGL上下文(2)

    错误 Javascript与WebGL之间的一个最大区别在于,WebGL的操作一般不会抛出错误 如果希望获取WebGL的错误信息,那么就需要手动调用  gl.getError() 方法 该方法会返回以 ...

  4. Javascript高级编程学习笔记(97)—— WebGL(3) WebGL上下文(1)

    WebGL上下文 在支持WebGL的浏览器中,WebGL的名字为 "experimental-webgl",这是由于 webgl 的规范仍未制定完成 制定完成后名字就会改为简单的 ...

  5. 【WebGL】WebGL API 详解

    基于 WebGL Specifications 最全面的API释疑. 类型以及对象定义 这部分内容主要定义一部分类型和数据结构. typedef unsigned long GLenum; typed ...

  6. 有关于OpenGL、OpenGL ES、WebGL的小结

    转自原文 有关于OpenGL.OpenGL ES.WebGL的小结 一.   OpenGL简介 OpenGL(全写Open Graphics Library)是个定义了一个跨编程语言.跨平台的编程接口 ...

  7. WebGL入门教程(五)-webgl纹理

    前面文章: WebGL入门教程(一)-初识webgl WebGL入门教程(二)-webgl绘制三角形 WebGL入门教程(三)-webgl动画 WebGL入门教程(四)-webgl颜色 这里就需要用到 ...

  8. WebGL入门教程(二)-webgl绘制三角形

    前面已经介绍过了webgl,WebGL入门教程(一)-初识webgl(http://www.cnblogs.com/bsman/p/6128447.html),也知道了如何绘制一个点,接下来就用web ...

  9. WebGL入门教程(一)-初识webgl

    一.WebGL和传统网页的区别: 普通网页组成成分:HTML.JavaScript: WebGL网页组成成分:HTML5.JavaScript和GLSL ES(着色器语言 OpenGL ES): 二. ...

  10. WebGL自学教程——WebGL演示样本:开始

    最终开始WebGL样品演示,...... 开始 使用WebGL步骤,非常easy: 1. 获得WebGL的渲染环境(也叫渲染上下文). 2. 发挥你的想象力,利用<WebGL參考手冊>中的 ...

随机推荐

  1. Eclipase .自动提示

    打开eclipse→Windows→Preferences→Java→Editor→Content Assist 修改Auto Activation triggers for java的值为 .abc ...

  2. java的接口为什么不能实例化

    java的接口为什么不能实例化呢?首先,我们需要明白实例化的含义.实例化实际意义是在jvm的堆中开辟出一块内存空间,比如Student s = new Student();此处声明Student对象s ...

  3. Java 对比Hashtable、Hashmap、Treemap有什么不同?

    ①基本理解 Hashtable.Hashmap.Treemap都是最常见的一些Map实现,是以键值对的形式存储和操作数据的容器类型. Hashtable是Java类库提供的一个哈希实现,本身是同步的, ...

  4. 带你走进ajax(2)

    ajax原理介绍 传统的web应用 传统的web应用是客户端向服务器发送一个http请求后,客户端要一直等待服务器的响应,这时用户什么事也干不成. 最麻烦的是对于表单的提交.比如用户要填写用户信息,等 ...

  5. hello java !

    我对于计算机性编程性质的课程一直没有很好的悟性,但功夫不服有心,最近自己学习视频课程,随时关注娄老师的博客,慢慢的对于java编程有了新的认识,也用eclipse软件进行了简单java的编译. 了解的 ...

  6. 20145211《网络渗透》MS12-004漏洞渗透

    20145211<网络渗透>MS12-004漏洞渗透 一 实验原理 初步掌握平台matesploit的使用 有了初步完成渗透操作的思路 在这里我选择对的不是老师推荐的MS11_050,而是 ...

  7. TCP深入详解

    TCP三次握手.四次挥手时序图: #TCP协议状态机 1.TCP建立连接时的初始化序列号X.Y可以是写死固定的吗?      如果初始化序列号(缩写为ISN:Inital Sequence Numbe ...

  8. char,short,int长度

    数据类型的本质就是固定内存大小的别名 char:1byte short:  2byte int:4byte 其实变量也是对连续内存的别名,相当于这段内存的句柄.钩子

  9. MysQL使用一高级应用(上)

    简介 实体与实体之间有3种对应关系,这些关系也需要存储下来 在开发中需要对存储的数据进行一些处理,用到内置的一些函数 视图用于完成查询语句的封装 事务可以保证复杂的增删改操作有效 关系 创建成绩表sc ...

  10. ubuntu 18.04在更新软件库时出现E: Release file for http://security.ubuntu.com/ubuntu/dists/bionic-security/InRelease is not valid yet...

    1.完整的错误信息如下: E: Release file for http://security.ubuntu.com/ubuntu/dists/bionic-security/InRelease i ...