在世界轴上旋转网格 - THREE.js答案

【问题标题】：Rotating Mesh in world axis - THREE.js在世界轴上旋转网格 - THREE.js
【发布时间】：2015-12-07 09:50:14
【问题描述】：

我在旋转对象时遇到了困难。我目前正在使用THREE.Shape配置自定义形状，创建形状后，我将其配置为Mesh并将其位置设置为：

buildingMesh.position.set( -70, -300, levelY );

现在由于mesh 和camera 的位置，它看起来好像是站起来的。

这看起来像：

现在我最近添加了一个围绕世界轴旋转的Orbital 相机，一旦相机移动，它的外观就是这样：

现在这是有道理的，因为在使用 Three.Shape 时从未配置过 y axis。我现在想弄清楚的是如何转动那个物体，让它看起来像是站起来的，如第一张图片所示。我曾尝试在 x、y、z 轴上使用旋转，但它似乎总是只在对象轴内旋转。

有什么建议吗？

这是我在另一个问题上发现的一些尝试：

rotateAroundWorldAxis: function(object, axis, radians) {
        this.rotWorldMatrix = new THREE.Matrix4();
        this.rotWorldMatrix.makeRotationAxis(axis.normalize(), radians);
        this.rotWorldMatrix.multiply(object.matrix);        // pre-multiply
        object.matrix = this.rotWorldMatrix;
        object.rotation.setFromRotationMatrix(object.matrix);
    }

【问题讨论】：

标签： javascript three.js

【解决方案1】：

试试：

mesh.rotate.x = Math.PI // will rotate over x axis 180 degree

“网格”是您创建的对象（您也可以旋转“y”和“z”）

【讨论】：

【解决方案2】：

所以这里的主要问题是网格是由多层构建的。所有这些层实际上必须组合成一个Object3D，这反过来又让我可以简单地做：group.rotateOnAxis(axis,Math.pow(Math.PI, 2) / 2);

希望这对将来的任何人都有帮助。

【讨论】：