如何使用 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)根据位于平面上的三角形定义了一个平面。这些点的排列方式使平面的法线（归一化 "cross product of the vectors (p3 - p1) and (p2 - p1)"）指向外。我们可以根据平面方程Ax+Bx+Cx+D=0定义平面如下：

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

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

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

由于问题要求更详细，我会添加它：

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

对于每组平面点(p1)(p2)(p3)，求系数平面方程，如上定义。

找到与三个或更多平面相交的一组点。这个通过检查每组三个平面是否相交来完成在一点。结果通常会比那里多很多点是最终多面体中的顶点，所以现在我们需要剔除它们。

对于每个点，检查该点是否在所有飞机。更具体地说，如果 D+dot(P,N) <= 0，则点在平面内，其中 D 和 N 是上面给出的平面参数，P 是问题所在。只保留所有平面内的点。

消除重复点。重复通常表明更多比三个平面相交于同一点。

最后一步是生成点的凸包。算法例如 QuickHull 在这里很有用。结果将是凸的每个面都是凸多边形的多面体。如有必要，每个多面体的面可以使用相对简单的方法进行三角剖分程序。

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

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

How can I generate a cube using JavaScript and this coordinate format?

javascript

computational-geometry