Saltar al contenido

three.js: ¿cómo hago girar un cilindro alrededor de un punto específico?

Solución:

Supongo que lo que quieres decir es que quieres que un objeto gire alrededor de un punto específico dentro de su geometría.

Por ejemplo, el cylinderGeometry gira alrededor de su centrar. Suponga que quiere que gire alrededor de su fin.

Lo que debe hacer es trasladar la geometría del cilindro justo después de su creación para que el punto deseado dentro de la geometría esté ahora en el origen.

geometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, cylinderHeight/2, 0 ) );

EDITAR: ahora puede hacer esto, en su lugar:

geometry.translate( 0, cylinderHeight/2, 0 ); // three.js r.72

Ahora, cuando gire el cilindro, ahora girará alrededor de su extremo, en lugar de su centro.

El extremo alrededor del cual gira también se ubicará en la posición que ha establecido para la malla del cilindro.

Obviamente, puede hacer esto con cualquier geometría, no solo con cilindros.

Para dar un ejemplo de código para la respuesta anterior de WestLangley:

// CYLINDER
var cyl_material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
var cyl_width = 1;
var cyl_height = 5;
// THREE.CylinderGeometry(bottomRadius, topRadius, height, segmentsRadius, segmentsHeight, openEnded )
var cylGeometry = new THREE.CylinderGeometry(cyl_width, cyl_width, cyl_height, 20, 1, false);
// translate the cylinder geometry so that the desired point within the geometry is now at the origin
cylGeometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, cyl_height/2, 0 ) );
var cylinder = new THREE.Mesh(cylGeometry, cyl_material);

scene.add( cylinder );    

Ahora la rotación funciona alrededor del origen del cilindro:

cylinder.rotation.x = 0.5*Math.PI;

Espero que ayude.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *