webgl 中的矩阵和投影

Question

// Upload Projection, ModelView matrices
gl.uniformMatrix4fv(shaderProgram.uMVMatrix, false, pMVMatrix);
gl.uniformMatrix4fv(shaderProgram.uPMatrix, false, perspM);

在上面几行中，我了解到正在上传投影矩阵和模型视图矩阵。我想知道这背后的数学原理。

我有一些 3d 顶点 (overlayvertices)，后来以这种方式传递：

// Upload overlay vertices                      
gl.bindBuffer(gl.ARRAY_BUFFER, overlayVertices[elementIndex]);
gl.vertexAttribPointer(shaderProgram.aVertexPosition, 3, gl.FLOAT,false, 0, 0);

其中 overlayvertices[i] 是一个包含 x,y,z,1 的 4*1 数组

最终绘图发生在确定模型视图和投影矩阵的特定相机的帧上。我想手动获取相机帧中的变换顶点。即 (x,y,1)。我稍后在每一帧内下载数据，因此 x,y 应该是像素坐标。由于这发生在 webgl 内部，我无法检索此信息。

Answer 1

缺少的部分（在您的问题中）是绘图时使用的顶点着色器。这个顶点着色器将获取两个矩阵并使用它们来变换顶点。具体如何取决于着色器，但在大多数情况下，表达式为

gl_Position = P * MV * vertex_position

这正是您想要在 OpenGL 之外重现该变换的计算，即它的顶点着色器阶段。

webgl 中的矩阵和投影

Matrices and projection in webgl

opengl-es

webgl

projection-matrix