了解截断二十面体的几何形状，用于渲染

Question

我正在尝试使用Three.js 渲染一个截断的二十面体，如上图所示，带有可点击区域。

我找到了常规二十面体的代码

var t = ( 1 + Math.sqrt( 5 ) ) / 2;

var vertices = [
    [ -1,  t,  0 ], [  1, t, 0 ], [ -1, -t,  0 ], [  1, -t,  0 ],
    [  0, -1,  t ], [  0, 1, t ], [  0, -1, -t ], [  0,  1, -t ],
    [  t,  0, -1 ], [  t, 0, 1 ], [ -t,  0, -1 ], [ -t,  0,  1 ]
];

var faces = [
    [ 0, 11,  5 ], [ 0,  5,  1 ], [  0,  1,  7 ], [  0,  7, 10 ], [  0, 10, 11 ],
    [ 1,  5,  9 ], [ 5, 11,  4 ], [ 11, 10,  2 ], [ 10,  7,  6 ], [  7,  1,  8 ],
    [ 3,  9,  4 ], [ 3,  4,  2 ], [  3,  2,  6 ], [  3,  6,  8 ], [  3,  8,  9 ],
    [ 4,  9,  5 ], [ 2,  4, 11 ], [  6,  2, 10 ], [  8,  6,  7 ], [  9,  8,  1 ]
];

THREE.PolyhedronGeometry.call( this, vertices, faces, radius, detail );

并得出结论，t is φ & vertices 由以下所有排列组成：

(0, ±1, ±φ) (±1, ±φ, 0) (±φ, 0, ±1) - 来自Here

所以我修改了我的顶点：

(0, ±1, ±3φ)(±2, ±(1+2φ), ±φ)(±1, ±(2+φ), ±2φ) - 来自Here

导致：

var vertices = [
        [-2, (1+2*t,t], [2,(1+2*t), t ], [-2,-(1+2*t),-t], [2,-(1+2*t),-t ],
        [0,-1,3*t], [0,1,3*t], [0,-1,-3*t], [0,1,-3*t],
        [1,-(2+t),-2*t ],[1,(2+t),2*t],[-1,-(2+t),-2*t],[-1,(2+t),2*t]
];

现在我知道我还必须修改faces。二十面体似乎有 20 个三角形面，我只能在 Three.js 中用三角形构造任何多边形。

然后，我需要 5 个五边形和 12 个六边形的坐标，格式如下：

5 * 12 + 6 * 20 = 180三角形

如果是这样，我应该如何继续生成这些坐标？或者即使我对整个事情都错了。

Answer 1

JSModeler 框架可以生成很多实体，包括截断的二十面体，所以也许来源可以帮助你。

如果您找到 GenerateTruncatedIcosahedron，您可以在此处找到代码： https://github.com/kovacsv/JSModeler/blob/master/src/extras/solidgenerator.js

代码创建了具有五个和六个顶点的多边形，但是用三角形替换它们很容易。