Question

在webgl中编写特定场景时，转换对象的常用过程是定义原始顶点位置数据并将其传递给顶点着色器，其中顶点与矩阵相乘，它包含有关透视，平移，旋转和缩放的信息，因此相应的顶点着色器代码（例如）将如下所示：

gl_Position = projectionMatrix * modelviewMatrix * vec4(vertexPosition, 1.0);

modelviewMatrix 本身就是 viewMatrix 与 modelMatrix 相乘的结果，这也是连续矩阵操作的结果翻译，旋转和缩放。

我现在想知道的是，乘法链中的最后一个链接是如何工作的 - mat4 与任意长度的向量数组相乘。

someMatrix * vec4(vertexPosition, 1.0);

这是因为我在webgl编辑器上写作，我希望能够保存创建的和转换 3D对象的顶点位置数据，而无需添加有关矩阵变换，但作为原始位置数据，简单为{x，y，z，x，y，z，x，y，z等}，就像原始顶点数组一样。

作为一个基本的例子，我们假设我们有一个简单三角形的以下顶点：

var vertices = [0.0, 1.0, 0.0,  -1.0, -1.0, 0.0,  1.0, -1.0, 0.0];

然后我按[2, 0, 0]创建 mat4 和翻译。

我需要的函数然后将这个翻译的 mat4 和 vertices 数组作为参数，将两者相乘并返回翻译的数组顶点如：

var translatedVertices = [2.0, 1.0, 0.0,  1.0, -1.0, 0.0,  3.0, -1.0, 0.0];

很明显，对于将4x4矩阵与向量数组相乘，必须为其添加第四个值，因此第一步应该是拆分原始 vec3 数组并插入对于每个三元组值，需要额外1.0，以使其成为 vec4 数组，[x, y, z] --> [x, y, z, 1]，但除此之外，我完全不知道这个JavaScript函数应该如何显示

Answer 1

当你说

时

someMatrix * vec4(vertexPosition, 1.0);

someMatrix是一个4x4矩阵，vertexPosition总是一个3x1矩阵，通过添加1.0转换为4x1矩阵。因此，乘以4x1矩阵的4x4矩阵将再次产生有效的4x1矩阵（即gl_Position）。请注意，4x1矩阵是vec4。

所以你永远不会乘以“任意”长度的向量。当您向下传递数据（即您的vertices变量）时，系统将它们分解为三元组，添加1.0并执行4x4乘4x1乘法。

如何将4x4矩阵与任意长度的矢量数组相乘？

1 个答案: