three.js三维模型定位

Question

由于我没有找到现有的three.js四轴飞行器模型，我正试图模拟一个 我创建了这个“加号”符号，但我想将它定位为“十字”符号，即在纬度上旋转+ 45°或-45°

我不是这个意思：

mesh.rotation.y+=THREE.Math.degToRad(45);

因为我需要像这样横向旋转：

https://jsfiddle.net/vcoumu83/25/

我的意思是当我在X轴上移动鼠标时，十字架应该水平旋转而不是对角线，在图像的虚线轴上

更新
我想实现这个目标：

Answer 1

我不确定，你想要什么。但是，如果我添加这些行，它看起来就像你的图像：

mesh.rotation.x = THREE.Math.degToRad(90);
mesh.rotation.y = THREE.Math.degToRad(45);

请参阅更新的jsfiddle：strtok() only returns one token

更新：您需要将rotation.y设置为新的轮值。

mesh.rotation.y = THREE.Math.degToRad(x);

https://jsfiddle.net/vcoumu83/30/

Answer 2

虽然Brakebein的答案是正确的，但我认为你可能更简单的方法是在XY平面上重新排列几何体而不是XZ，然后在Z轴上旋转它。

var x1=new THREE.BoxGeometry(25,1,1);
var x2=new THREE.BoxGeometry(1,25,1);
...
mesh.rotation.z = THREE.Math.degToRad(45);

检查此jsfiddle的第36-37行。