图形学笔记

莫西摩西
14 阅读5分钟

计算机图形学

基础线代

向量数量积(点积)

定义：

 a⃗ ⋅ b⃗ = ∣a⃗∣ ⋅ ∣b⃗∣ ⋅ cos⁡θ  \vec{a} \cdot \vec{b} = |\vec{a}| \cdot |\vec{b}| \cdot \cos\theta 

数量积最终的结果是一个数，例如：

代码块


// 向量的各个分量相乘然后再相加

const a = new Vector3(2,3,4)

const b = new Vector3(4,2,1)

// [2 3 4] * [4 2 1] = 2*4 + 3*2 + 4*1 = 18

几何意义

1. 已知两个向量，可以求两个向量之间的夹角，向量的数量积除以两个向量的长度乘积得到夹角的余弦值，计算公式如下：

    cos⁡θ = a⃗ ⋅ b⃗∣a⃗∣ ⋅ ∣b⃗∣  \cos\theta = \frac{\vec{a} \cdot \vec{b}}{|\vec{a}| \cdot |\vec{b}|} 

2. 数量积越大，两个向量就越相似，大于0的时候两个向量的夹角就小于90度，等于0则两向量垂直，小于0两个向量的夹角大于90度并且小于180度

应用方面

例如：金属材质，镜面反射，如果观察方向正对光线出射方向，则就看到了光点，那就比较亮，其他出射方向周围的观察方向就暗一些，创造出一种金属感

向量积（叉积）

- 定义：向量 cc: c⃗ = a⃗ × b⃗\vec{c} = \vec{a} \times \vec{b}

- 方向：cc的方向垂直于aa、bb向量所决定的平面，相当于空间解析几何中的法向量，cc的指向按右手法则从aa转到bb来决定

- 模长：∣c⃗∣ = ∣a⃗∣ ⋅ ∣b⃗∣ ⋅ sin⁡θ  (0° ≤ θ ≤ 180°)|\vec{c}| = |\vec{a}| \cdot |\vec{b}| \cdot \sin\theta \quad (0° \le \theta \le 180°)

性质

- 平行的两个向量，它们的叉积为0，即如果 a⃗ // b⃗\vec{a} // \vec{b}，则 abab向量叉积为0

- 叉积不符合交换律

   a⃗ × b⃗ = −b⃗ × a⃗  \vec{a} \times \vec{b} = -\vec{b} \times \vec{a} 

几何意义

- 叉积得到模等于abab向量构成的平行四边形的面积

计算公式

 a⃗ × b⃗ = ( ya zb − yb za  za xb − zb xa  xa yb − ya xb )  \vec{a} \times \vec{b} = \begin{pmatrix} y_a z_b - y_b z_a \\ z_a x_b - z_b x_a \\ x_a y_b - y_a x_b \end{pmatrix} 

用矩阵乘以一个向量的形式计算

 a⃗ × b⃗ = ( 0  −za  ya  za  0  −xa  −ya  xa  0 ) ( xb  yb  zb )  \vec{a} \times \vec{b} = \begin{pmatrix} 0 & -z_a & y_a \\ z_a & 0 & -x_a \\ -y_a & x_a & 0 \end{pmatrix} \begin{pmatrix} x_b \\ y_b \\ z_b \end{pmatrix} 

应用

1. 判断向量的相对左右关系

2. 判断内与外

   a. AB→ × AP→\overrightarrow{AB} \times \overrightarrow{AP}，BC→ × BP→\overrightarrow{BC} \times \overrightarrow{BP}，CA→ × CP→\overrightarrow{CA} \times \overrightarrow{CP} 如果 APAP，BPBP，CPCP 都在右侧或者左侧(叉积方向相同)，则 PP 点是在三角形内部，否则在外部（光栅化会用到）

3. 创建坐标系

矩阵相乘

nn行mm列和mm行kk列的矩阵可以相乘。

向量默认为列向量。

1. 可以结合律，不能交换律，矩阵相乘的顺序不能变

2. 矩阵相乘从右到左，例如以下：先旋转45度，在平移一个单位向量

    T(1,0) ⋅ R45 [ x  y  1 ] = [ 1  0  1  0  1  0  0  0  1 ] [ cos⁡ 45°  −sin⁡ 45°  0  sin⁡ 45°  cos⁡ 45°  0  0  0  1 ] [ x  y  1 ]  T_{(1,0)} \cdot R_{45} \begin{bmatrix} x \\ y \\ 1 \end{bmatrix} = \begin{bmatrix} 1 & 0 & 1 \\ 0 & 1 & 0 \\ 0 & 0 & 1 \end{bmatrix} \begin{bmatrix} \cos 45° & -\sin 45° & 0 \\ \sin 45° & \cos 45° & 0 \\ 0 & 0 & 1 \end{bmatrix} \begin{bmatrix} x \\ y \\ 1 \end{bmatrix} 

变换TODO

1. 物体变换

2. 视图变换

3. 投影变换

光栅化

1. 采样

2. 反走样

3. 抗锯齿

深度测试

画家算法

深度缓冲

着色

光照与基本着色模型

着色频率、图形管线、纹理映射

插值、高级纹理映射

3D渲染原理与流程

顶点着色器

顶点着色器是一个可编程的处理单元，功能为执行顶点的变换、光照、材质的应用与计算等与顶点相关的操作，每个顶点执行一次

图元装配

1. 图元组装

   在点绘制方式下，每个图元只需要一个独立的定点组成图元，在线段模式下，则需要两个顶点组成一个图元，在三角形模式下，则需要三个顶点组成一个图元，那例如我们的正方体，则是有12三角形图元组成

2. 图元处理

   图元处理最重要的工作就是裁剪，随着观察角度、距离不同，所有的图元都不展示在屏幕上，所以就需要进行裁剪，如果该图元完全在视野内（视景体）（相机投影）或者自定义的裁剪平面外部，则会丢弃该图元，如果图元一部分在内部，另一部分又在外部，则需要进行图元裁剪

投影

将三维世界投影到二维平面上

光栅化

将3D世界内的物体投影到我们二维的显示设备上，三维世界的几何信息都是连续的，例如一条线中间没有间断，投影到平面上的结果也是连续的，但是我们的显示设备是由一个个像素组成的，所以会需要将连续的几何信息拆分成一个个小单元，对应物理设备中的像素，这一个小单元一般称像素，一个片元就是对应一个像素点。光栅化就是将图元进行分解，一条线切成小点点，每一个小点包含一个顶点坐标、顶点颜色、顶点纹理坐标以及顶点深度等信息都是通过与此片元有关的图元各顶点信息以及投影进行插值计算生成的，插值计算也是就进行图元拆分成片元。

- 此阶段过程：将远离相机的图元先进行光栅化成一组片元，并将该片元并写入帧缓冲对应的位置，后续继续处理距离相机近一点的图元并光栅化出一组片元，也写入帧缓冲，如果这两组片元中有重叠的位置，这后写入的片元覆盖之前的片元（如何检测蒙版在深度检测阶段完成）

片元着色器

片元着色器是处理片元值及相关数据的可编程单元，可以执行纹理采样、颜色汇总、计算蒙皮颜色等操作，每个片元执行一次，处理颜色

剪裁测试

判断每一个片元是否在剪裁窗口内，在的话将片元送入下一阶段，否则则丢弃

多重采样操作

背面剔除

深度测试

将上一阶段输出的片元的深度和帧缓冲中该位置的片元的深度进行比较，若输入的片元深度较小，则将该片元送入一阶段，并输入的片元和源片元进行覆盖混合，否则丢弃该片元

模板测试

主要功能是将绘画的范围限制特定范围内，一般用于画入面倒影、镜像、物体裁剪

颜色缓冲混合

如果程序开启了Alpha颜色混合，则对上一阶段输出的片元和帧缓冲中对应位置的片元进行Alpha颜色混合；否则上阶段输出的片元直接覆盖帧缓冲中对应位置的片元

帧缓冲

三维世界物体绘制并不是直接在屏幕上绘制的，而是预先在帧缓冲中进行绘制，每绘制完一帧就将绘制结果交到屏幕上，所以每次绘制新的帧时都需要清除缓冲中的相关数据，否则得到的渲染结果就不正确。

帧缓冲包以下几部分：

1. 颜色缓冲，存储每一个片元的颜色值

2. 深度缓冲，存储每一个片元的深度信息，就是三维空间中片元到相机的距离

3. 模板缓冲，存储每一个片元的模板值，供模板测试使用

avatar
文章
阅读
粉丝