如何绘制旋转 3D 对象的轴并设置角度？答案

【问题标题】：How do I draw and set an angle to the axis of a rotating 3D Object?如何绘制旋转 3D 对象的轴并设置角度？
【发布时间】：2015-05-20 01:21:26
【问题描述】：

我有一个旋转的行星（带环的土星），我将相机设置为：

  var camera = new THREE.PerspectiveCamera(45, width / height, 0.05, 1000);
  camera.position.z = 3;
  camera.position.y = 1;
  camera.position.x = 1;

我在这里得到的是从某个角度看到的行星，但行星本身位于平坦的 x-y-z 轴上。

看起来是这样的：Saturn & Rings

我希望画一条虚线来显示行星的实际轴，它与太阳平面的正交（假设太阳平面 = 'x-z'）成“Ɵ”角。以及如何更改行星默认轴 (XYZ) 设置的角度。

【问题讨论】：

标签： javascript 3d three.js

【解决方案1】：

如果你想在一个轴上旋转你的行星网格，你可以使用这样的模式：

mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );

mesh.add( new THREE.AxisHelper( 10 ) ); // show the local coordinate system

mesh.rotation.set( 0, 0, - Math.PI / 8 ); // set initial orientation

然后，在你的渲染循环中，

mesh.rotateY( 0.01 ); // rotate mesh around its local Y-axis

three.js r.71

【讨论】：