three.js - 用 Three.js 创建一个凹半球

Question

我是一名拥有良好 JavaScript 经验的 Web 开发人员，我目前正在探索Three.js 的可能性。但是，我对 3D 形状和词汇不是很熟悉，也不知道如何构建我需要的形状。

我想创建一个半球，并能够在这个球内投影视频。我有一个全景球面视频，我需要对其进行扭曲以使其看起来像“平面”。

感谢 Paul 的教程，我绘制了一个球体并将我的视频投影在上面。但是外球面是凸的，我需要一个凹的！我怎样才能做到这一点？从我最初的球体中挤出一个较小的球体？

Answer 1

SphereGeometry您可以通过设置附加参数来创建半球体：

SphereGeometry( radius, widthSegments, heightSegments, phiStart, phiLength, thetaStart, thetaLength )

试验直到你得到你想要的。

您还必须将side用于球体的材料的属性设置为THREE.BackSide或THREE.DoubleSide。

material.side = THREE.DoubleSide;

SphereBufferGeometry，它在内存方面更有效，现在也可用。它的构造函数具有相同的参数。

（三.js r.82）

Answer 2

您可以使用 SphereBufferGeometry，来创建一个半球体（hemisphere）。最后一个论点做到了：0.5 * Math.PI. 为了能够看到某些东西，您需要使用THREE.DoubleSidefor material。

var geometry = new THREE.SphereBufferGeometry(5, 8, 6, 0, 2*Math.PI, 0, 0.5 * Math.PI);
...
material.side = THREE.DoubleSide;