坐标系相关知识

  比较重要的主要有五个坐标系统：

  • 局部空间（Local Space，或称为物体空间（Object Space））
  • 世界空间（World Space）
  • 观察空间（View Space，或称为眼空间（Eye Space））
  • 裁剪空间（Clip Space）
  • 屏幕空间（Screen Space）

坐标空间

  为了将坐标从一个坐标系变换到另一个坐标系，我们需要用到几个变换矩阵，最重要的几个分别是模型(Model) 矩阵、观察 (View) 矩阵 和 投影 (Projection) 矩阵。

  我们的顶点坐标起始于局部空间(Local Space)，在这里它称为局部坐标(Local Coordinate)，并最后以屏幕坐标(Screen Coordinate)的形式结束。

  下图展示了整个的变换流程：

image-20201018185023147
  1. 局部坐标是对象相对于局部原点的坐标，也是物体起始的坐标。
  2. 下一步是将局部坐标变换为世界空间坐标，世界空间坐标是处于一个更大的空间范围的。这些坐标相对于世界的全局原点，它们会和其它物体一起相对于世界的原点进行摆放。
  3. 接下来我们将世界坐标变换为观察空间坐标，使得每个坐标都是从摄像机或者说观察者的角度进行观察的。
  4. 坐标到达观察空间之后，我们需要将其投影到裁剪坐标。裁剪坐标会被处理至 -1.0 到 1.0 的范围内，并判断哪些顶点将会出现在屏幕上。
  5. 最后，我们将裁剪坐标变换为屏幕坐标，我们将使用一个叫做视口变换(Viewport Transform)的过程。视口变换将位于 -1.0 到 1.0 范围的坐标变换到由 glViewport函数所定义的坐标范围内。最后变换出来的坐标将会送到光栅器，将其转化为片段。

  之所以将顶点变换到各个不同的空间的原因是有些操作在特定的坐标系统中才有意义且更方便。

  例如：

  • 当需要对物体进行修改的时候，在局部空间中来操作会更说得通；

  • 如果要对一个物体做出一个相对于其它物体位置的操作时，在世界坐标系中来做这个才更说得通；

  • 等等。

局部空间

  局部空间是指物体所在的坐标空间，即对象最开始所在的地方。

  想象你在一个建模软件（比如说Blender）中创建了一个立方体。你创建的立方体的原点有可能位于(0, 0, 0)，即便它有可能最后在程序中处于完全不同的位置。甚至有可能你创建的所有模型都以(0, 0, 0)为初始位置（然而它们会最终出现在世界的不同位置）。

  所以，你的模型的所有顶点都是在局部空间中：它们相对于你的物体来说都是局部的。

世界空间

  如果我们将我们所有的物体导入到程序当中，它们有可能会全挤在世界的原点(0, 0, 0)上，这并不是我们想要的结果。我们想为每一个物体定义一个位置，从而能在更大的世界当中放置它们。

  世界空间中的坐标正如其名：是指顶点相对于（游戏）世界的坐标。如果你希望将物体分散在世界上摆放（特别是非常真实的那样），这就是你希望物体变换到的空间。物体的坐标将会从局部变换到世界空间；该变换是由 模型矩阵(Model Matrix) 实现的。

  模型矩阵是一种变换矩阵，它能通过对物体进行位移、缩放、旋转来将它置于它本应该在的位置或朝向。你可以将它想像为变换一个房子，你需要先将它缩小（它在局部空间中太大了），并将其位移至郊区的一个小镇，然后在 y 轴上往左旋转一点以搭配附近的房子。

观察空间

  观察空间经常被人们称之为摄像机(Camera)（所以有时也称为摄像机空间(Camera Space)或视觉空间(Eye Space)）。

  观察空间是将世界空间坐标转化为用户视野前方的坐标而产生的结果。因此观察空间就是从摄像机的视角所观察到的空间。而这通常是由一系列的位移和旋转的组合来完成，平移/旋转场景从而使得特定的对象被变换到摄像机的前方。这些组合在一起的变换通常存储在一个观察矩阵(View Matrix)里，它被用来将世界坐标变换到观察空间。

裁剪空间

  在一个顶点着色器运行的最后，OpenGL期望所有的坐标都能落在一个特定的范围内，且任何在这个范围之外的点都应该被裁剪掉(Clipped)。被裁剪掉的坐标就会被忽略，所以剩下的坐标就将变为屏幕上可见的片段。这也就是裁剪空间(Clip Space)名字的由来。

  因为将所有可见的坐标都指定在 -1.0 到 1.0 的范围内不是很直观，所以我们会指定自己的坐标集(Coordinate Set)并将它变换回标准化设备坐标系。

  为了将顶点坐标从观察变换到裁剪空间，我们需要定义一个投影矩阵(Projection Matrix)，它指定了一个范围的坐标，比如在每个维度上的 -1000 到 1000。投影矩阵接着会将在这个指定的范围内的坐标变换为标准化设备坐标的范围(-1.0, 1.0)。所有在范围外的坐标不会被映射到在 -1.0到 1.0 的范围之间，所以会被裁剪掉。在上面这个投影矩阵所指定的范围内，坐标(1250, 500, 750)将是不可见的，这是由于它的 x 坐标超出了范围，它被转化为一个大于1.0的标准化设备坐标，所以被裁剪掉了。

  如果只是图元(Primitive)，例如三角形，的一部分超出了裁剪体积(Clipping Volume)，则OpenGL会重新构建这个三角形为一个或多个三角形让其能够适合这个裁剪范围。

  由投影矩阵创建的观察箱(Viewing Box)被称为平截头体(Frustum)，每个出现在平截头体范围内的坐标都会最终出现在用户的屏幕上。

  将特定范围内的坐标转化到标准化设备坐标系的过程（而且它很容易被映射到2D观察空间坐标）被称之为投影(Projection)，因为使用投影矩阵能将3D坐标投影(Project)到很容易映射到2D的标准化设备坐标系中。

  一旦所有顶点被变换到裁剪空间，最终的操作——透视除法(Perspective Division)将会执行，在这个过程中我们将位置向量的x，y，z分量分别除以向量的齐次w分量；透视除法是将4D裁剪空间坐标变换为3D标准化设备坐标的过程。这一步会在每一个顶点着色器运行的最后被自动执行。

  在这一阶段之后，最终的坐标将会被映射到屏幕空间中，并被变换成片段。

  将观察坐标变换为裁剪坐标的投影矩阵可以为两种不同的形式，每种形式都定义了不同的平截头体。主要有：正交投影矩阵(Orthographic Projection Matrix)和透视投影矩阵(Perspective Projection Matrix)。

正交投影

  正交投影矩阵定义了一个类似立方体的平截头箱，它定义了一个裁剪空间，在这空间之外的顶点都会被裁剪掉。创建一个正交投影矩阵需要指定可见平截头体的宽、高和长度。在使用正射投影矩阵变换至裁剪空间之后处于这个平截头体内的所有坐标将不会被裁剪掉。它的平截头体看起来像一个容器：

image-20201018191759632

  上面的平截头体定义了可见的坐标，它由由宽、高、近(Near)平面和远(Far)平面所指定。任何出现在近平面之前或远平面之后的坐标都会被裁剪掉。正交平截头体直接将平截头体内部的所有坐标映射为标准化设备坐标，因为每个向量的w分量都没有进行改变；如果w分量等于1.0，透视除法则不会改变这个坐标。

透视投影

  相比于正交投影，透视投影显得更加真实，它所投影的物体看起来进大远小。

  透视的效果在我们看一条无限长的高速公路或铁路时尤其明显，正如下面图片显示的那样：

image-20201018192044212

  由于透视，这两条线在很远的地方看起来会相交。

  这正是透视投影想要模仿的效果，它是使用透视投影矩阵来完成的。这个投影矩阵将给定的平截头体范围映射到裁剪空间，除此之外还修改了每个顶点坐标的w值，从而使得离观察者越远的顶点坐标w分量越大。被变换到裁剪空间的坐标都会在 -w 到 w 的范围之间（任何大于这个范围的坐标都会被裁剪掉）。OpenGL要求所有可见的坐标都落在 -1.0 到 1.0 范围内，作为顶点着色器最后的输出，因此，一旦坐标在裁剪空间内之后，透视除法就会被应用到裁剪空间坐标上：

out=(x/wy/wz/w)out = \begin{pmatrix} x /w \\ y / w \\ z / w \end{pmatrix}

  顶点坐标的每个分量都会除以它的w分量，距离观察者越远顶点坐标就会越小。

  如果你对正射投影矩阵和透视投影矩阵是如何计算的很感兴趣（且不会对数学感到恐惧的话）推荐这篇由Songho写的文章。

  一个透视平截头体可以被看作一个不均匀形状的箱子，在这个箱子内部的每个坐标都会被映射到裁剪空间上的一个点。下面是一张透视平截头体的图片：

image-20201018192418084

  fov 值表示了它的视野（field of view）大小，一般设置为 45 会显得比较真实。此外，若要创建一个这样的平截头体，还需要提供宽高比、近平面和远平面距离。通常设置近距离为0.1，而远距离设为100.0。所有在近平面和远平面内且处于平截头体内的顶点都会被渲染。

  当你把透视矩阵的 near 值设置太大时（如10.0），OpenGL会将靠近摄像机的坐标（在0.0和10.0之间）都裁剪掉，这会导致一个你在游戏中很熟悉的视觉效果：在太过靠近一个物体的时候你的视线会直接穿过去。

将变换矩阵组合到一起

  上述的每一个步骤都创建了一个变换矩阵：模型矩阵、观察矩阵和投影矩阵。一个顶点坐标将会根据以下过程被变换到裁剪坐标：

Vclip=Mprojection⋅Mview⋅Mmodel⋅VlocalV_{clip} = M_{projection} \cdot M_{view} \cdot M_{model} \cdot V_{local}

  注意矩阵运算的顺序是相反的（记住我们需要从右往左阅读矩阵的乘法）。

右手坐标系

  OpenGL是一个右手坐标系。简单来说，就是正 x 轴在你的右手边，正 y 轴朝上，而正 z 轴是朝向后方的。想象你的屏幕处于三个轴的中心，则正 z 轴穿过你的屏幕朝向你。坐标系画起来如下：

image-20201018193442847

  为了理解为什么被称为右手坐标系，按如下的步骤做：

  • 沿着正y轴方向伸出你的右臂，手指着上方。
  • 大拇指指向右方。
  • 食指指向上方。
  • 中指向下弯曲90度。

  如果你的动作正确，那么你的大拇指指向正x轴方向，食指指向正y轴方向，中指指向正z轴方向。

  如果你用左臂来做这些动作，你会发现 z轴的方向是相反的。这个叫做左手坐标系，它被DirectX广泛地使用。注意在标准化设备坐标系中OpenGL实际上使用的是左手坐标系（投影矩阵交换了左右手）。

欧拉角

  欧拉角(Euler Angle)是可以表示3D空间中任何旋转的3个值，由莱昂哈德·欧拉(Leonhard Euler)在18世纪提出。一共有3种欧拉角：俯仰角(Pitch)、偏航角(Yaw)和滚转角(Roll)，下面的图片展示了它们的含义：

image-20201018194424470

  对于我们的摄像机系统来说，我们只关心俯仰角和偏航角

  给定一个俯仰角和偏航角，我们可以把它们转换为一个代表新的方向向量的3D向量。

  我们先从最基本的情况开始：

image-20201018194704239

  把斜边边长定义为1，我们就能知道邻边的长度是 cos⁡ x/h=cos⁡ x/1=cos⁡ x\cos \ \color{red}x/\color{purple}h = \cos \ \color{red}x/\color{purple}1 = \cos\ \color{red}x，它的对边是 sin⁡ y/h=sin⁡ y/1=sin⁡ y\sin \ \color{green}y/\color{purple}h = \sin \ \color{green}y/\color{purple}1 = \sin\ \color{green}y。这样我们获得了能够得到x和y方向长度的通用公式，它们取决于所给的角度。我们使用它来计算方向向量的分量：

image-20201018195303241

  如果我们想象自己在xz平面上，看向y轴，我们可以基于第一个三角形计算来计算它的长度/y方向的强度(Strength)（我们往上或往下看多少）。

direction.y = sin(glm::radians(pitch)); // 注意我们先把角度转为弧度

  这里我们只更新了y值，仔细观察x和z分量也被影响了。从三角形中我们可以看到它们的值等于：

direction.x = cos(glm::radians(pitch));
direction.z = cos(glm::radians(pitch));

  下面来看航偏角：

image-20201018195223028

  就像俯仰角的三角形一样，我们可以看到x分量取决于cos(yaw)的值，z值同样取决于偏航角的正弦值。把这个加到前面的值中，会得到基于俯仰角和偏航角的方向向量：

direction.x = cos(glm::radians(pitch)) * cos(glm::radians(yaw)); // direction代表摄像机的前轴(Front)，这个前轴是和下图的摄像机的方向向量是相反的
direction.y = sin(glm::radians(pitch));
direction.z = cos(glm::radians(pitch)) * sin(glm::radians(yaw));
image-20201018195835526

  这样我们就有了一个可以把俯仰角和偏航角转化为用来自由旋转视角的摄像机的3维方向向量了。

鼠标输入

  偏航角和俯仰角是通过鼠标（或手柄）移动获得的，水平的移动影响偏航角，竖直的移动影响俯仰角。它的原理就是，储存上一帧鼠标的位置，在当前帧中我们当前计算鼠标位置与上一帧的位置相差多少。如果水平/竖直差别越大那么俯仰角或偏航角就改变越大，也就是摄像机需要移动更多的距离。

  在根据鼠标移动获取了俯仰角与偏航角后，就能用它们来计算真正的方向向量了：

glm::vec3 front;
front.x = cos(glm::radians(pitch)) * cos(glm::radians(yaw));
front.y = sin(glm::radians(pitch));
front.z = cos(glm::radians(pitch)) * sin(glm::radians(yaw));
cameraFront = glm::normalize(front);

  计算出来的方向向量就会包含根据鼠标移动计算出来的所有旋转了。

  注意，使用欧拉角的摄像机系统并不完美。根据你的视角限制或者是配置，你仍然可能引入万向节死锁问题。最好的摄像机系统是使用四元数(Quaternions)的。（[这里](https://github.com/cybercser/OpenGL_3_3_Tutorial_Translation/blob/master/Tutorial 17 Rotations.md)可以查看四元数摄像机的实现）

REF

REF ：https://learnopengl-cn.github.io/01 Getting started/08 Coordinate Systems/

WebGL的一些词汇表：https://learnopengl-cn.github.io/01 Getting started/10 Review/

 目录