web-dev-qa-db-fra.com

Comment faire pivoter un maillage de 90 degrés dans ThreeJS?

J'ai un maillage que je veux faire pivoter de 90 degrés à l'intérieur de Three JS. Voici l'image de la situation actuelle: enter image description here

Je souhaite que le maillage sélectionné soit pivoté parallèlement au grand maillage. J'ai essayé de faire tourner la matrice comme ceci:

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

Mais le maillage entre dans d'étranges rotations. Existe-t-il un moyen plus simple de le faire pivoter de 90 degrés?

javascriptmatrix3drotationthree.js
32
Zaay

La rotation à trois utilise des radians (comme vous le savez peut-être)

tu peux utiliser ça

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

ou

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

Vous pouvez faire pivoter un objet en utilisant cette fonction:

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

Disons que meshToRotate doit être pivoté de 90 degrés sur l'axe X. Ensuite, procédez comme suit.

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

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

Testé sur r96, vous pouvez également utiliser

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