WebGL：web 中的 2D 的 3D 图形 - Web API
WebGL：web 中的 2D 的 3D 图形WebGL（Web 图形库）是一种可在任何兼容的 Web 浏览器中无需使用插件即可渲染高性能交互式 3D 和 2D 图形的 JavaScript API
WebGL：web 中的 2D 的 3D 图形WebGL（Web 图形库）是一种可在任何兼容的 Web 浏览器中无需使用插件即可渲染高性能交互式 3D 和 2D 图形的 JavaScript API。WebGL 通过引入一个与 OpenGL ES 2.0 高度一致的 API 来做到这一点，该 API 可以在 HTML
所有现代浏览器都支持 WebGL（请参阅下方的兼容性表格）；然而，用户的设备也必须支持这些特性。
WebGL 2 API 引入了对 OpenGL ES 3.0 特性集的广泛支持；它通过 WebGL2RenderingContext 接口提供。
参考标准接口
WebGLRenderingContext
WebGL2RenderingContext
WebGLActiveInfo
WebGLBuffer
WebGLContextEvent
WebGLFramebuffer
WebGLProgram
WebGLQuery
WebGLRenderbuffer
WebGLSampler
WebGLShader
WebGLShaderPrecisionFormat
WebGLSync
WebGLTexture
WebGLTransformFeedback
WebGLUniformLocation
WebGLVertexArrayObject
扩展
ANGLE_instanced_arrays
EXT_blend_minmax
EXT_color_buffer_float
EXT_color_buffer_half_float
EXT_disjoint_timer_query
EXT_float_blend
实验性
EXT_frag_depth
EXT_shader_texture_lod
EXT_sRGB
EXT_texture_compression_bptc
EXT_texture_compression_rgtc
EXT_texture_filter_anisotropic
EXT_texture_norm16
KHR_parallel_shader_compile
OES_draw_buffers_indexed
OES_element_index_uint
OES_fbo_render_mipmap
OES_standard_derivatives
OES_texture_float
OES_texture_float_linear
OES_texture_half_float
OES_texture_half_float_linear
OES_vertex_array_object
OVR_multiview2
WEBGL_color_buffer_float
WEBGL_compressed_texture_astc
WEBGL_compressed_texture_etc
WEBGL_compressed_texture_etc1
WEBGL_compressed_texture_pvrtc
WEBGL_compressed_texture_s3tc
WEBGL_compressed_texture_s3tc_srgb
WEBGL_debug_renderer_info
WEBGL_debug_shaders
WEBGL_depth_texture
WEBGL_draw_buffers
WEBGL_lose_context
WEBGL_multi_draw
事件
webglcontextlost
webglcontextrestored
webglcontextcreationerror
常量和类型
WebGL 常量
WebGL 类型
WebGL 2WebGL 2 是对 WebGL 的一次重大更新，通过 WebGL2RenderingContext 接口提供。它基于 OpenGL ES 3.0，新特性包括：
3D 纹理、
采样对象、
Uniform 缓冲对象、
同步对象、
查询对象、
变换反馈对象、
现在已成为 WebGL 2 核心的推广扩展：顶点数组对象、实例化、多个渲染目标、片段深度。
另请参阅博客文章“WebGL 2 在 Firefox 中发布”以及 webglsamples.org/WebGL2Samples 上的一些演示。
指南和教程下面，你将找到各种指南，以帮助你学习 WebGL 概念和教程，提供分步课程和示例。
指南
WebGL 中的数据
编写 WebGL 代码时使用的变量，缓冲区和其他类型数据的指南。
WebGL 最佳实践
提示和建议，以帮助你提高 WebGL 内容的质量，性能和可靠性。
使用扩展
WebGL 扩展的使用指南。
教程
WebGL 教程
WebGL 核心概念的初学者指南。如果你以前没有 WebGL 的经验，那么这是一个很好的起点。
示例
一个基础的 WebGL 的 2D 动画示例
此示例展示了单色形状的简单动画。涉及的主题包括适应纵横比差异、从多组着色器构建着色器程序的方法，以及在 WebGL 中进行基本绘图的基础知识。
WebGL 示例
这是一系列附带简短解释的实时示例，旨在展示 WebGL 的概念和功能。这些示例按照主题和难度级别进行了排序，涵盖了 WebGL 渲染上下文、着色器编程、纹理、几何体、用户交互等内容。
高级教程
WebGL 模型视图投影
详细解释了通常用于表示 3D 对象视图的三个核心矩阵：模型矩阵、视图矩阵和投影矩阵。
Web 中的矩阵运算
有关如何在 Web 上使用 3D 变换矩阵的有用指南，适用于 WebGL 计算和 CSS 变换。
资源
Khronos WebGL 站点：Khronos 组织的 WebGL 官方站点。
WebGL 基本教程：提供了 WebGL 的基础知识。
Raw WebGL：WebGL 入门：来自 Nick Desaulniers 主讲的 WebGL 基础知识。
WebGL 演练场：用于创建和共享 WebGL 项目的在线工具。适合快速制作原型和进行实验。
WebGL 学院：一款 HTML/JavaScript 编辑器，提供学习 Webgl 编程基础的教程。
WebGL 统计：一个提供不同平台上浏览器 WebGL 功能统计信息的站点。
库
three.js 是一个开源、功能齐全的 3D WebGL 库。
Babylon.js 是一个强大、简洁且开放的游戏和 3D 渲染引擎，封装在一个友好的 JavaScript 框架中。
Pixi.js 是一个快速、开源的 2D WebGL 渲染器。
Phaser 是一个用于 Canvas 和 WebGL 支持的浏览器游戏的快速、免费和有趣的开源框架。
PlayCanvas 是一个开源游戏引擎。
glMatrix 是一个用于高性能 WebGL 应用程序的 JavaScript 矩阵和矢量库。
twgl 是一个用于减少 webgl 冗余的库。
RedGL 是一个开源 3D WebGL 库。
vtk.js 是一个用于在浏览器中实现科学可视化的 JavaScript 库。
webgl-lint 将帮助查找 WebGL 代码中的错误并提供有用信息。
规范SpecificationWebGL Specification # 5.14WebGL 2.0 Specification # 3.7浏览器兼容性api.WebGLRenderingContextapi.WebGL2RenderingContext兼容性说明除了浏览器之外，GPU 本身也需要支持该特性。例如，S3 纹理压缩（S3TC）仅在基于 Tegra 的平板电脑上可用。大多数浏览器可以通过 webgl 这一上下文名称来使用 WebGL，但较旧的浏览器需要 experimental-webgl。此外，即将推出的 WebGL 2 完全向后兼容，其使用的上下文名称为 webgl2。
Gecko 说明WebGL 调试与检测
Firefox 提供了两个可用的偏好设置，让你可以控制 WebGL 的测试功能：
webgl.min_capability_mode
一个布尔属性，当设为 true 时，会启用最低功能模式。在这种模式下，WebGL 会被配置成仅支持 WebGL 规范要求的最低限度的特性集和功能。这可确保你的 WebGL 代码在任何设备或浏览器上都能运行，无论它们的能力如何。默认情况下，该属性为 false。
webgl.disable_extensions
一个布尔属性，当设为 true 时，会禁用所有 WebGL 扩展。默认情况下，该属性为 false。
参见
Canvas API
有关 WebGL 扩展的兼容性信息