web-dev-qa-db-ja.com

ThreeJSでメッシュを90度回転させるにはどうすればよいですか？

Three JS内で90度回転させたいメッシュがあります。現在の状況のイメージは次のとおりです。 enter image description here

選択したメッシュを大きなメッシュと平行に回転させたい。私はこのようにマトリックスを回転させようとしました：

matrix =   new THREE.Matrix4().makeRotationX(1.57)

しかし、メッシュは奇妙な回転に入ります。 90度回転させる簡単な方法はありますか？

javascriptmatrix3drotationthree.js
32
Zaay

Threejsの回転では、ラジアンを使用します（ご存知かもしれません）

これを使用できます

mesh.rotation.x = Math.PI / 2;

または

mesh.rotation.set(new THREE.Vector3( 0, 0, Math.PI / 2));
43
Absulit

この関数を使用して、オブジェクトを回転できます。

function rotateObject(object, degreeX=0, degreeY=0, degreeZ=0) {
   object.rotateX(THREE.Math.degToRad(degreeX));
   object.rotateY(THREE.Math.degToRad(degreeY));
   object.rotateZ(THREE.Math.degToRad(degreeZ));
}

// usage:
rotateObject(myPlane, 40, 30, 20);
16
Harun ERGUL

meshToRotateをX軸で90度回転する必要があるとしましょう。次に、以下を実行します。

        var meshToRotate = new THREE.Mesh( geometry, material );

        //Rotating mesh by 90 degree in X axis.     
        meshToRotate.rotateX( Math.PI / 2 );
7
prahadeesh

R96でテスト済みで、以下も使用できます

mesh.rotation.setFromVector3(new THREE.Vector3( Math.PI / 2, 0, 0));
2
Tib