走进WebGL

什么是 WebGL？

WebGL 是一种跨平台、免版税的 API，用于在 Web 浏览器中创建 3D 图形。基于 OpenGL ES 2.0，WebGL 使用 OpenGL 着色语言 GLSL，并提供熟悉的标准 OpenGL API。因为它在 HTML5 Canvas 元素中运行，所以 WebGL 与所有文档对象模型 (DOM) 接口完全集成。

WebGL 是一个 DOM API，这意味着它可以在任何兼容 DOM 的语言中使用：JavaScript、Java，或者——如果你将 WebKit 嵌入到 Mac 上的应用程序中——Objective C。

主要浏览器供应商 Google (Chrome)、Opera (Opera)、Mozilla (Firefox) 和 Apple (Safari) 以及许多其他 3D 图形开发商都是 Khronos 联盟 WebGL 工作组的成员。

主要优势

因为它基于 OpenGL 并将集成到流行的浏览器中，WebGL 提供了许多优势，其中包括：

基于熟悉且广泛接受的 3D 图形标准的 API
跨浏览器和跨平台兼容性
与 HTML 内容紧密集成，包括分层合成、与其他 HTML 元素的交互以及使用标准 HTML 事件处理机制
适用于浏览器环境的硬件加速 3D 图形
使 3D 图形原型制作变得容易的脚本环境——您无需编译和链接即可查看和调试渲染图形

先决条件

WebGL 是一种低级 API，因此不适合胆小的人。OpenGL 的着色语言 GLSL 本身就是一个完整的编程环境。因此，即使是 WebGL 中的简单事物也需要相当多的代码。您必须加载、编译和链接着色器，设置要传递给着色器的变量，还必须执行矩阵数学以使形状具有动画效果。您需要熟悉的基本领域包括：

GLSL，OpenGL 和 WebGL 使用的着色语言
用于设置转换的矩阵计算
顶点缓冲区保存关于顶点位置、法线、颜色和纹理的数据（？）
幸运的是，有许多资源可以帮助您了解 OpenGL ES、GLSL 和其他标准 3D 图形编程概念。好的起点如下：

OpenGL ES 2.0 编程指南，作者 Aaftab Munshi、Dan Ginsburg 和 Dave Shreiner（Addison-Wesley Professional，2008 年）
OpenGL 教程
OpenGL 光照和多边形表面教程