javascript - 如何使用 JavaScript 和这种坐标格式生成立方体？

Question

给定这段代码:

{
( 256 64 16 ) ( 256 64 0 ) ( 256 0 16 ) mmetal1_2 0 0 0 1 1
( 0 0 0 ) ( 0 64 0 ) ( 0 0 16 ) mmetal1_2 0 0 0 1 1
( 64 256 16 ) ( 0 256 16 ) ( 64 256 0 ) mmetal1_2 0 0 0 1 1
( 0 0 0 ) ( 0 0 16 ) ( 64 0 0 ) mmetal1_2 0 0 0 1 1
( 64 64 0 ) ( 64 0 0 ) ( 0 64 0 ) mmetal1_2 0 0 0 1 1
( 0 0 -64 ) ( 64 0 -64 ) ( 0 64 -64 ) mmetal1_2 0 0 0 1 1
}

如何使用 JavaScript(或任何其他库)和上面的坐标生成立方体？上面的代码应该解释如下:

In the example shown here, this brush is a 6 sided cuboid. The plane of its first face is defined by 3 points, ( 256 64 16 ) ( 256 64 0 ) ( 256 0 16 ). The other information supplied is the texture used by the face. "mmetal1_2" is the name of the texture, a single plane may only have a single texture. "0 0 0 1 1" are how the texture is display, and are respectively "X offset" "Y offset" "Rotation" "X scale" and "Y scale".

The plane points ( p1 ) ( p2 ) ( p3 ) are interpreted as follows. The plane points must be arranged such that the cross product of the vectors (p3 - p1) and (p2 - p1) is not null, that is, the three points must be linearly independent. Then, the normalized cross product represents the normal vector of the plane. Every point p for which (p - p1) * normal <= 0 (where * is the dot product) holds is considered to be in the half space defined by the plane. Every other point is considered not to be in the half space.

注意 #1:如有必要，可以使用 CSS。

注意#2:我在这里真正需要的是概念和数学函数。我可以使用 JavaScript 循环提取坐标，但我不知道最初如何处理这个问题。我只需要朝着正确的方向轻推。

注意#3:我只需要前三组值，不需要纹理和偏移量。

以下是此坐标系的规范: https://quakewiki.org/wiki/Quake_Map_Format

Answer 1

积分(p1)(p2)(p3)根据位于平面上的三 Angular 形定义平面。这些点的排列方式使平面的法线(归一化的“矢量 (p3 - p1) 和 (p2 - p1) 的叉积”)指向外。我们可以根据平面方程 Ax+Bx+Cx+D=0 来定义平面如下:

   (A, B, C) = N = normalize(cross(p3-p1,p2-p1))
   D = -dot(p1,N)

这些平面的交点形成一个凸多面体。找到这个多面体涉及找到平面相交的顶点作为步骤之一。您提到的维基文章链接到 journal article解释生成这些顶点的一种方法。

您提到的格式使用其半空间表示(或h-表示或h-rep).由于一组给定的平面可以描述许多凸多面体，因此您更有可能希望将凸多面体的最小半空间表示转换为其最小顶点表示(或v-representation 或 v-rep)。此处，最小表示是其顶点至少与三个平面相交但描述的实体与所有半空间相交。然后，您需要生成最小顶点表示的凸包。

---

由于问题要求更详细，我将添加它:

生成多面体的网格涉及 以下步骤。

1. 对于每组平面点 (p1)(p2)(p3) , 求系数 平面方程，如上定义。
2. 找出与三个或更多平面相交的一组点。这 通过检查每组三个平面是否相交来完成 在一点。结果通常会比那里多很多点 是最终多面体中的顶点，所以现在我们需要剔除它们。
3. 对于每个点，检查该点是否在所有 飞机。更具体地说，如果D+dot(P,N) <= 0，则点在平面内。 , 其中 D 和 N 是上面给出的平面参数，P 是问题所在。仅保留所有平面内的点。
4. 消除重复点。重复通常表明更多 三个平面相交于同一点。
5. 最后一步是生成点的凸包。算法 例如 QuickHull 在这里很有用。结果将是凸的 每个面都是凸多边形的多面体。如有必要，每个 多面体的面可以使用相对简单的方法进行三 Angular 剖分 程序。

I have written code实现了这个方法。