用 Three.js 创建一个凹半球答案

【问题标题】：Create a concave halfsphere with Three.js用 Three.js 创建一个凹半球
【发布时间】：2012-09-14 12:54:12
【问题描述】：

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

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

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

【问题讨论】：

标签： three.js

【解决方案1】：

您可以通过设置额外的SphereGeometry 参数来创建半球体：

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

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

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

material.side = THREE.DoubleSide;

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

(Three.js r.82)

【讨论】：

太棒了！这正是我想要的！这是最终代码：SphereGeometry(5000,16,16, Math.PI/2, Math.PI*2, 0, Math.PI) 和 material.side = THREE.BackSide

【解决方案2】：

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

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

【讨论】：