《WebGL 编程指南》笔记 —— 第七章 进入三维世界

1. 视点（eye point）：观察者所处的（三维空间中的）位置。（eyeX, eyeY, eyeZ）

2. 视线（viewing direction）：从视点出发沿着观察方向的射线称作视线。

3. 观察目标点（look-at point）：被观察目标所在的点。视线从视点出发，穿过观察目标点并继续延伸。(atX, atY, atZ)

4. 上方向（up direction）：最终绘制在屏幕上的影像中的向上的方向。(upX, upY, upZ)

5. 视点、观察目标点和上方向可以构成一个视图矩阵（view matrix）

6. 等式：
   旋转后顶点坐标 = 旋转矩阵 × 原始顶点坐标
"从视点看上去"的旋转后顶点坐标 = 视图矩阵 × 旋转后顶点坐标
   "从视点看上去"的变换后顶点坐标 = 视图矩阵 × 模型矩阵 × 原始顶点坐标

7. 可视范围（visible range）: 观察得到的区域边界。
   WebGL只绘制可视范围内的对象，降低程序开销。

8.可视空间：由水平视角、垂直失焦和可视深度（能够看多远）定义
可是空间常分为两类：
（1）长方体可视空间，也称盒状空间，由正射投影（orthographic projection）产生。

由前后两个矩形表面确定，分别称近裁剪面（near clipping plane）和远裁剪面（far clipping plane）。

近裁剪面的四个顶点为(right, top, -near), (-left, top, -near), (-left, -bottom, -near), (right, -bottom, -near)。

近裁剪面与远裁剪面之间的盒形空间就是可视空间，只有在此空间内的物体会被显示出来。

远裁剪面的四个顶点为(right, top, far), (-left, top, far), (-left, -bottom, far), (right, -bottom, far)

（2）四棱锥 / 金字塔可视空间，由透视投影（perspective projection）产生。

透视投影矩阵（perspective projection matrix）定义了透视投影可视空间的矩阵。

fov: 垂直失焦，即可视空间顶面和底面间的夹角，必须大于0
aspect: 近裁剪面的宽高比（宽度 / 高度）

9. 等式
   正射投影后的坐标 = 正射投影矩阵 × 视图矩阵 × 顶点坐标
"从视点看上去"的投影后变换后顶点坐标 = 投影矩阵 × 视图矩阵 × 模型矩阵 × 原始顶点坐标

10. 隐藏面消除（hidden surface removal）：消除那些被遮挡的表面（隐藏面）
    开启隐藏面消除功能
    前提：必须设置可视空间（正射投影空间或透视投影空间）
    步骤：
    （1）开启隐藏面消除功能： gl.enable(gl.DEPTH_TEST);
gl.enable()规范：

（2）在绘制之前，清除深度缓冲区（depth buffer）：gl.clear(gl.DEPTH_BUFFER_BIT);

与gl.enable()函数对应的还有gl.disable()函数。禁用某个功能:

11. 深度冲突（Z fighting）：当几何图形或物体的两个表面极为接近时，深度缓冲区有限的精度已经不能区分哪个在前，哪个在后了，就会使得表面看上去斑斑驳驳的。

解决方案： 多边形偏移（polygon offset），该机制将直接在Z值上加上一个偏移量，偏移量的值由物体表面相对于观察者视线的角度来确定。
启动该机制步骤：
（1）启用多边形偏移：gl.enable(gl.POLYGON_OFFSET_FILL);
（2）在绘制之前指定用来计算偏移量的参数： gl.polygonOffset(1.0, 1.0);

12. 画立方体

gl.drawElements()