javascript - 如何旋转 THREE.TubeGeometry 段？

Question

我创建了一个半径Segments = 2 的平面 THREE.TubeGeometry，将其添加到场景中时垂直于地面:

是否可以旋转每个管段，使它们与地面平行？

JSFiddle example.

var points = [];
for (var i = 0; i < 5; i++) {
   var randomY = i*5/2*10 + -50;
   var randomX = 15*Math.sin(5*i);
   points.push(new THREE.Vector3(randomX, randomY, 0));
}
var tubeGeometry = new THREE.TubeGeometry(new THREE.SplineCurve3(points), 64, 6, 2, false);
tubeMesh = createMesh(tubeGeometry);
scene.add(tubeMesh);

Answer 1

我对您的建议是使用自定义平面几何体(不是 TubeGeometry!)并计算您希望它们所在的顶点(而不是旋转!)。

获取几何图形的方法类似于:

1. 创建随机点(这里需要一些数学知识才能将它们放在您想要的位置，但这是有趣的部分!)
2. 从每条曲线获取样条点
3. 对它们进行三 Angular 测量

如果您决定继续使用此处的代码，请进行更改以使其与平面平行。在tubeMesh创建之后添加到generateTube函数:

tubeMesh.rotateY(Math.PI/2);