如何在做这种映射的 Three.js 上设置投影矩阵？答案

【问题标题】：How to set a projection matrix on Three.js which does this kind of mapping?如何在做这种映射的 Three.js 上设置投影矩阵？
【发布时间】：2012-12-12 14:17:21
【问题描述】：

如何在 Three.js 上制作一个投影矩阵，按照以下规则描述从 3d 点到屏幕坐标的映射？

screen_x = x - z*0.5
screen_y = y - z*0.5
depth = z

【问题讨论】：

标签： matrix 3d three.js projection-matrix

【解决方案1】：

投影矩阵表示以下方程：

xx xy xz xt    <- x' = (xx*x + xy*y + xz*z + xt) / (wx*x + wy*y + wz*z + 1)
yx yy yz yt       y' = (yx*x + yy*y + yz*z + yt) / (wx*x + wy*y + wz*z + 1)
zx zy zz zt       z' = (zx*x + zy*y + zz*z + zt) / (wx*x + wy*y + wz*z + 1)
wx wy wz  1

因此所有其他元素都将为零，但是

screen_x = x-z*0.5 : xx=1,       xz=-0.5
screen_y = y-z*0.5 :       yy=1, xz=-0.5
depth  z'= z       :             zz=1      (and ww=1)

编辑这不是一般的投影矩阵，而是只适用于这个特定的问题。

一般[对称]投影矩阵的形式为

 a  0  0  d 
 0  b  0  e  
 0  0  c  f 
 0  0  1  0,

由此得出 x 和 y 将除以 wx*z == z。

【讨论】：

谢谢（这就是我一直在尝试的，但我只是认为我使用了错误的渲染器，它没有实现 z-buffer）。不过，我很高兴真正了解发生了什么。 wx wy 和 wz 值的解释是什么？另外，我猜你弄错了：这里的最后一个元素（“1”）实际上可以缩放整个结果，正如我通过实验发现的那样。
没有单独解释 wx,wy,wz 值，但 row0+-row3 表示左/右裁剪平面的平面方程。 row1+-row3 := 顶/底平面方程和 row2+-row3 是视锥体的近/远剪辑平面方程。作为一个整体 (x y z 1) * persp_Matrix 将视锥体（截断的金字塔）转换为单位立方体。相反，一个向量矩阵乘法可以判断一个点是在视图外还是在视图内。
可以通过修改 ww-term 进行缩放——但仅当 xt,yt,zt 向量为零时。普遍正确的方法是将 ViewMatrix 的上部 3x3 向量相乘，然后将结果与（相当稀疏的）投影矩阵相乘。（一旦相乘，我认为缩放“分散”在 VP 矩阵周围，我认为它不能绝对仅位于左上角）