javascript - 如何在 three.js 轴上旋转 3D 对象？

Question

我对 three.js 中的旋转有很大的疑问 我想在我的一个游戏中旋转我的 3D 立方体。

//init
geometry = new THREE.CubeGeometry grid, grid, grid
material = new THREE.MeshLambertMaterial {color:0xFFFFFF * Math.random(), shading:THREE.FlatShading, overdraw:true, transparent: true, opacity:0.8}
for i in [1...@shape.length]
    othergeo = new THREE.Mesh new THREE.CubeGeometry(grid, grid, grid)
    othergeo.position.x = grid * @shape[i][0]
    othergeo.position.y = grid * @shape[i][1]
    THREE.GeometryUtils.merge geometry, othergeo
@mesh = new THREE.Mesh geometry, material

//rotate
@mesh.rotation.y += y * Math.PI / 180
@mesh.rotation.x += x * Math.PI / 180
@mesh.rotation.z += z * Math.PI / 180

和 (x, y, z) 可能是 (1, 0, 0)

然后立方体可以旋转，但问题是立方体绕着自己的轴旋转，所以旋转后，它不能像预期的那样旋转。

我找到页面 How to rotate a Three.js Vector3 around an axis? , 但它只是让一个 Vector3 点绕世界轴旋转？

并且我尝试使用 ma​​trixRotationWorld 作为

@mesh.matrixRotationWorld.x += x * Math.PI / 180
@mesh.matrixRotationWorld.y += y * Math.PI / 180
@mesh.matrixRotationWorld.z += z * Math.PI / 180

但是不管用，我不知道是我用错了还是有其他方法..

那么，如何让3D立方体绕世界轴旋转呢？？？

Answer 1

从 r59 版本开始，three.js 提供了这三个 functions围绕对象轴旋转对象。

object.rotateX(angle);
object.rotateY(angle);
object.rotateZ(angle);