这篇文章需要技术复核。如何帮忙。

这篇文章需要文法复核。如何帮忙。

翻译正在进行中。

WebGL (Web Graphics Library) 是一个用以渲染交互式3D和2D图形的无需插件且兼容下一代浏览器的 JavaScript API。WebGL 引用的JavaScript API遵守OpenGL ES2.0规范,通过HTML5中 <canvas> 元素实现功能。

目前支持 WebGL 的浏览器有:Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+ 和 Internet Explorer 11+;然而, WebGL一些特性也需要用户的硬件设备支持。

<canvas>元素也可以使用 Canvas 2D 来实现在网页中绘制2D图形。

参考

标准接口

扩展接口

事件

常量和类型

指南和教程

进阶指南

资源

  • Raw WebGL: An introduction to WebGL Nick Desaulniers 主讲的WebGL 基础知识。如果你从未接触过底层的图形编程,这是一个开始学习初级图形编程的好地方。
  • Khronos WebGL site Khronos Group 的WebGl 官方站点。
  • Learning WebGL 一个关于如何使用WebGL的教程站点。
  • WebGL Fundamentals 一个关于WebGL的初级教程。
  • WebGL playground 一个在线创建和分享WebGL的工具站点,非常适合快速创建一个原型或者体验一个成品。
  • WebGL Academy 通过一个 HTML/JavaScript 编辑器来学习一个基础的WebGl基础知识。

  • glMatrix 创建高性能WebGL应用的JavaScript矩阵矢量库。
  • Sylvester 一个开源的 JavaScript矩阵矢量库,不仅为WebGL优化过,而且很健壮。

规范

规格 状态 建议
WebGL 1.0 Recommendation Initial definition.
WebGL 2.0 Editor's Draft  

浏览器兼容性

Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
Basic support 4.0 (2.0) 9 11 12 (experiment) 5.1 (experiment)
OES_texture_float 6.0 (6.0) ? ? ? ?
OES_standard_derivatives 10.0 (10.0) ? ? ? ?
EXT_texture_filter_anisotropic 13.0 (13.0) ? ? ? ?
WEBGL_compressed_texture_s3tc 15.0 (15.0) ? ? ? ?
drawingBufferWidth and drawingBufferHeight attributes 9.0 (9.0) ? ? ? ?
Feature Firefox Mobile (Gecko) Chrome for Android IE Mobile Opera Mobile Safari Mobile
Basic support 4 25 (experiment) 未实现 12 (experiment) 8.1
drawingBufferWidth and drawingBufferHeight attributes 9.0 (9.0) 25 ? ? ?
OES_texture_float 6.0 (6.0) 25 ? ? ?
OES_standard_derivatives 10.0 (10.0) 25 ? ? ?
EXT_texture_filter_anisotropic 13.0 (13.0) 25 ? ? ?
OES_element_index_uint ? 25 ? ? ?
OES_vertex_array_object ? 25 ? ? ?
WEBGL_compressed_texture_s3tc 15.0 (15.0) 25
prefixed with WEBKIT_
? ? ?
WEBKIT_EXT_texture_filter_nisotropic 未实现 25 未实现 未实现 ?
[1] 这个特性目前在试验阶段.

 

兼容性说明

除了浏览器,GPU本身也需要支持这个特性. 举个例子, S3 纹理压缩 (S3TC) 只可以用在基于图睿的GPU处理器. 大多数浏览器支持 webgl context name, 但是旧的浏览器支持 experimental-webgl更好些. 除此之外, 即将来临的 WebGL 2 只会向后兼容,在未来将使用新的上下文名称 experimental-webgl2 (目前正在测试中).

Gecko备忘

WebGL调试与检测

开始使用Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7), 在测试中,这里有两个参数可以让你来控制WebGL性能:

webgl.min_capability_mode
一个以布尔值存储的属性。当它的值为True时,将会启用最小性能模式。当这个模式启用时。WebGL将会仅提供由其标准指定的最基本的功能集和性能支持。这样可以确保您的WebGL代码能够在性能的设备和浏览器上正确运行。它的默认值是False
webgl.disable_extensions
一个以布尔值存储的属性。当它的值为True时,会禁用所有的WebGL拓展。它的默认值是False。

参见

文档标签和贡献者

标签: 
 最后编辑者: wth,