1. 主页
  2. 文档
  3. 从零开始的计算机图形_程序员的3D渲染介绍教程
  4. 从零开始的计算机图形_程序员的3D渲染介绍 描述和渲染一个场景
  5. 表示一个立方体

表示一个立方体

让我们再次思考如何表示和操作一个立方体,这次的目标是找到一种更普遍的方法。如图10-1所示,我们的立方体的边长为2个单位,与坐标轴平行,并以原点为中心。

图10-1:我们的标准立方体

这些是它的顶点的坐标。

A = (1, 1, 1)
B = (–1, 1, 1)
C = (–1, –1, 1)
D = (1, –1, 1)
E = (1, 1, –1)
F = (–1, 1, –1)
G = (–1, –1, –1)
H = (1, –1, –1)

立方体的边是正方形,但我们开发的算法是针对三角形的。我们首先选择三角形的原因之一是,任何其他多边形,包括正方形,都可以分解成三角形。所以我们将用两个三角形来表示立方体的每个正方形边。

然而,我们不能拿立方体的任何三个顶点来期望它们描述其表面的一个三角形(例如,ADG在立方体内部)。这意味着顶点坐标本身并不能完全描述立方体:我们还需要知道哪三组顶点描述了构成其边的三角形。

下面是我们的立方体可能的三角形列表。


A, B, C
A, C, D
E, A, D
E, D, H
F, E, H
F, H, G
B, F, G
B, G, C
E, F, B
E, B, A

C, G, H
C, H, D


这表明我们可以用一个通用的结构来表示任何由三角形组成的物体:一个Vertices列表,保存每个顶点的坐标;和一个Triangles列表,指定哪一组三个顶点描述物体表面的三角形。

三角形列表中的每个条目除了组成它的顶点外,还可以包括其他信息;例如,这将是指定每个三角形的颜色的最佳位置。

由于存储这些信息的最自然方式是两个列表,我们将使用列表索引来指称顶点列表中的顶点。所以我们的立方体将被表示成这样。


Vertices
0 = ( 1, 1, 1)
1 = (-1, 1, 1)
2 = (-1, -1, 1)
3 = ( 1, -1, 1)
4 = ( 1, 1, -1)
5 = (-1, 1, -1)
6 = (-1, -1, -1)
7 = ( 1, -1, -1)
Triangles
0 = 0, 1, 2, red
1 = 0, 2, 3, red
2 = 4, 0, 3, green
3 = 4, 3, 7, green
4 = 5, 4, 7, blue
5 = 5, 7, 6, blue
6 = 1, 5, 6, yellow
7 = 1, 6, 2, yellow
8 = 4, 5, 1, purple
9 = 4, 1, 0, purple
10 = 2, 6, 7, cyan
11 = 2, 7, 3, cyan


用这种表示法渲染一个物体是非常简单的:我们首先投影每个顶点,将它们存储在一个临时的投影顶点列表中(因为每个顶点平均被使用四次,这避免了大量的重复工作);然后我们通过三角形列表,渲染每个单独的三角形。第一个近似值看起来就像清单10-1。

RenderObject(vertices, triangles) {
    projected = []
    for V in vertices {
        projected.append(ProjectVertex(V))
    }
    for T in triangles {
        RenderTriangle(T, projected)
    }
}
RenderTriangle(triangle, projected) {
    DrawWireframeTriangle(projected[triangle.v[0]],
    projected[triangle.v[1]],
    projected[triangle.v[2]],
    triangle.color)
} 

清单10-1:一个渲染任何由三角形组成的物体的算法

我们可以按照上面的定义,直接将其应用到立方体上,但是结果看起来并不理想。这是因为它的一些顶点在摄像机后面,正如我们在前一章中所讨论的,这将会产生一些奇怪的东西。如果你看一下顶点坐标和图10-1,你会发现坐标原点,也就是我们的摄像机的位置,是在立方体里面。

为了解决这个问题,我们只需移动立方体。要做到这一点,我们需要将立方体的每个顶点向同一方向移动。让我们把这个方向称为T,代表 “平移”。我们将把立方体向前平移7个单位,以确保它完全处于摄像机的前面。我们还将把它向左平移1.5个单位,使它看起来更有趣。因为 “forward”是$Z_+$的方向,”left”是$X_-$的方向,所以平移向矢量就是

$\vec{T} = \begin{pmatrix} –1.5 \\ 0 \\ 7 \end{pmatrix}$

为了计算立方体中每个顶点V的平移版本V ‘,我们只需要添加平移向量:

V′ = V + $\vec{T}$

在这一点上,我们可以把立方体,平移每个顶点,然后应用清单10-1中的算法,得到我们的第一个三维立方体(图10-2)。

图10-2:我们的立方体,在摄像机前平移,用线框三角形进行渲染

您可以在https://gabrielgambetta.com/cgfs/scene-demo上找到该算法的现场实现。

这篇文章对您有用吗? 1