javascript - 哪个面在平行投影中更远？

Question

我在一个几何程序上使用 JavaScript(React) 创建指定对象的轴测图(更好的平行投影) 由顶点和面定义(一个面可以有不同数量的顶点)。

当您不需要不透明的面孔时，它会完美地工作，否则应该在下面的面孔上方。

所以我想对我的面孔列表从远到近进行排序:

[
[[100, 0, 100], [50, 50, 50], [120, 170, 120], [10, 200, 150]],
[[10, 20, 30], [10, 200, 250], [50, 50, 50], [100, 30, 30]],...
]

我将使用 faces.sort(sortingFunction)。

我不关心相交的面孔

(它将所有物体的面都放在一起)

sortingFunction 应该如何设置？

您必须考虑轴测图是如何定义的。它由X、Y轴旋转定义(Xrotation可以大于也可以小于Yrotation)，Z旋转为π/4(90°)。

这是一个旧版本的应用程序，可以让您理解我的意思:http://dev_proiezioni.surge.sh/

对不起我糟糕的英语。谢谢

Answer 1

您尝试做的事情称为“背面剔除”。一种常见的技术是确定多边形表示中的点列表从相机的 Angular 来看是顺时针顺序还是逆时针顺序。这需要您非常小心地创建顶点列表。有关更多详细信息，请查看维基百科文章:https://en.wikipedia.org/wiki/Back-face_culling。实现部分描述了您必须将其转换为 JavaScript 所涉及的数学。请注意，此技术比对面孔列表进行排序更快，因为它只需要检查每张面孔一次，而不是将每张面孔与其他面孔进行比较。