javascript - 了解 chop 二十面体的几何形状,以进行渲染

标签 javascript graphics three.js geometry

enter image description here

我正在尝试使用Three.js渲染一个像上面这样的带有可点击区域的 chop 二十面体。 。

我找到了正二十面体的代码

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 是 φ & 顶点 由以下所有排列组成:

(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]
];

现在我明白我也必须修改面孔。二十面体似乎有 20 个三 Angular 形面,我可以在 Three.js 中仅使用三 Angular 形构造任何多边形。

那么我需要 5 个五边形和 12 个六边形的坐标,其形式为:

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

如果是这样,我应该如何继续生成这些坐标?或者即使我对整件事的看法都是错误的。

最佳答案

JSModeler 框架可以生成很多实体,包括 chop 的二十面体,所以也许源代码可以帮助您。

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

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

关于javascript - 了解 chop 二十面体的几何形状,以进行渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20789627/

相关文章:

javascript - 尝试测试输入更改方法,但似乎不起作用

java - java中的线图

java - 哪一种更适合游戏开发? Jpanel还是jframe?

ios - Metal 着色器中的不同顶点格式

javascript - Three.js - 在相机方向和球体的交点处绘制一个大点

javascript - 如何使用 jQuery 删除属性?

javascript - 编写重复函数的更好方法?

javascript - 如果不支持 javascript,bootstrap 会回退到 html 模式吗?

javascript - 爆炸或移动网格远离中心

javascript - three.js 如何缓存(本地存储)3d 模型和纹理?