Three.js Cómo usar quaternion para girar la cámara

En Three.js, me gustaría usar THREE.quaternion para hacer que el objeto de la cámara gire hacia el objeto seleccionado.Three.js Cómo usar quaternion para girar la cámara

Realicé búsquedas en la web pero no encontré ningún ejemplo/demostración o documento sobre cómo usar esta clase de cuaternión.

que probar suerte con el siguiente código:

camera = new THREE.PerspectiveCamera(40, window.innerWidth/window.innerHeight, 1, 10000); 
    camera.position.y = 10; 
    camera.position.z = 0; 
    camera.position.x = radious; 
    camera.useQuaternion = true; 

    // I did use the TrackballTrackballControls. Maybe it causes the problem so I put it here 
    controls = new THREE.TrackballControls(camera, document.getElementById(_canvasElement)); 

    // function to make the camera rotate to the object 
    function focusOn3DObject(obj){ 
     obj.useQuaternion = true; 
     obj.quaternion = new THREE.Quaternion(obj.position.x, obj.position.y, obj.position.z, 1); 

     var newQuaternion = new THREE.Quaternion(); 
     THREE.Quaternion.slerp(camera.quaternion, obj.quaternion, newQuaternion, 0.07); 
     camera.quaternion = newQuaternion; 
    }

Pero no funciona. ¿Me he perdido algo? Por favor ayuda. Gracias por adelantado.

Fuente

2012-07-26 user1533481

Tenga en cuenta que en las compilaciones más recientes de THREE.js, 'useQuaternion' se ha eliminado. La biblioteca ahora usa cuaterniones por defecto. –

También tenga en cuenta que hoy (agosto/2015) los objetos de la Cámara TRES tienen un método .lookAt (vector3) - recibe un Vector3 con la posición de un objeto para mirar. Puede pasar cualquier object3d.position como parámetro, para que la cámara lo mire. Compruébelo: http://threejs.org/docs/index.html#Reference/Cameras/Camera – Tiago

creo que esta línea no trabajará:

obj.quaternion = new THREE.Quaternion(obj.position.x, obj.position.y, obj.position.z, 1);

Es necesario establecer

obj.useQuaternion = true

Después de añadir objetos a la escena, al girar éste se aplicará automáticamente a obj.quaternion.

El segundo punto es que debe aplicar el objeto a sus controles y no a la cámara. ¿Porque quieres controlar el objeto y no la cámara?

Fuente

2012-07-26 15:41:47

Me gustaría hacer que la cámara gire y se enfoque en el objeto. La cámara se movería alrededor del objeto. Entonces creo que la cámara estará controlada. ¿Estaba equivocado? – user1533481

Parece que estoy encontrando en la oscuridad ya que no hay ningún documento o un ejemplo sobre esto :(. ¿Podría explicarme la función slerp? ¿Para qué sirve el parámetro? Intenté su sugerencia pero no lo logré. – user1533481

Nota que en las compilaciones más nuevas de THREE.js, 'useQuaternion' ha sido eliminada. La biblioteca ahora usa cuaterniones por defecto. –

Slerp es bastante fácil. Toma 4 parámetros:

targetRotation la cámara real de rotación de la rotación
destinationRotation el objeto
destinationRotation nueva cuaternión que será la nueva rotación de la cámara
percentOfRotation este parámetro es parque infantil, estoy usando 0,07 aquí en este momento, podría ser un valor entre 0 (0%) y 1 (100%)

Este es mi método de rotación:

var qm = new THREE.Quaternion(); 
THREE.Quaternion.slerp(camera.quaternion, destRotation, qm, 0.07); 
camera.quaternion = qm; 
camera.quaternion.normalize();

Espero que esto te ayude. Y no te preocupes, también trabajé algunas semanas en la siguiente cámara perfecta.

Fuente

2012-08-06 13:53:27

Hola, en la documentación, .slerp tiene solo 2 parámetros ... https://threejs.org/docs/#Reference /Math/Quaternion ... ¿He entendido mal algo? –

@ SébastienGarcia-Roméo hay dos métodos de slerp en Quaternion: el que se utiliza en esta respuesta es el estático. Ambos se enumeran en la [página de documentación de quaternion] (https: //threejs.org/docs/#api/math/Quaternion.slerp), pero el método estático está en la parte inferior. –

Three.js Cómo usar quaternion para girar la cámara

Respuesta

Cuestiones relacionadas