--- title: WebGL 教程 slug: Web/API/WebGL_API/Tutorial tags: - WebGL - 教程 - 概览 translation_of: Web/API/WebGL_API/Tutorial ---
WebGL 使得网页在支持HTML {{HTMLElement("canvas")}} 标签的浏览器中,不需要使用任何插件,便可以使用基于 OpenGL ES 2.0 的 API 在 canvas 中进行3D渲染. WebGL 程序由javascript的控制代码,和在计算机的图形处理单元(GPU, Graphics Processing Unit)中执行的特效代码(shader code,渲染代码) 组成. WebGL 元素可以和其他HTML元素混合, 并且会和页面的其他部分或页面背景相合成.
此教程从基础开始讲解如何使用<canvas>
元素来画WebGL 图形. 提供的例子会让你对WebGL有更清晰的认识, 并且会提供代码片段方便你构建自己的内容.
使用 <canvas>
元素并不困难,但你需要基本的 HTML 和 JavaScript 知识。一些老浏览器不支持<canvas>
元素和 WebGL,但所有最近的主流浏览器都支持它们.。为了能在canvas中绘制图形,我们使用Javascript的上下文环境(context)对象,此对象可以动态创建图形。