WebGL学习记录(1)

WebGL（Web图形库）是一个JavaScript API，可在任何兼容的Web浏览器中渲染高性能的交互式3D和2D图形，而无需使用插件。WebGL通过引入一个与OpenGL ES 2.0非常一致的API来做到这一点，该API可以在HTML5 元素可被用来通过JavaScript（Canvas API 或 WebGL API）绘制图形及图形动画。")元素中使用。 这种一致性使API可以利用用户设备提供的硬件图形加速。

（PS: 引用来源于mdn官方文档）

WebGL可以简单理解为主要是对3D绘制在网页端的图形规范，只需支持的浏览器即可进行访问体验，无需额外的插件or本地应用程序。

基础概念

1. 三维坐标系（x/y/z轴）；顶点→多边形→网格/模型；纹理映射（位图）、材质（凹凸效果、辉光效果等）、光源；变换（模型缩放、旋转、位移等）通过矩阵；相机、透视、视口、投影（三维需要投射成二维展示）；着色器。
2. 使用WebGL把图形渲染到页面中，至少需要执行以下步骤

• 创建一个画布元素（canvas）；
• 获取画布的上下文(content)；
• 初始化视口；
• 创建一个或者多个包含渲染数据的数组（通常是顶定数组）；
• 创建一个或者多个矩阵，将顶点数组变换到屏幕空间中；
• 创建一个或者多个着色器来实现绘制算法；
• 绘制。

参考书目

• 《WebGL入门指南》