javascript three.js rotation dat.gui

javascript - Three.js-Torus no está girando alrededor del eje 0z



rotation dat.gui (1)

Intento hacer girar un torus largo de 2 ejes: Ox y Oz. Quiero aplicar esta rotación con un control deslizante dat.gui modificado por el mouse.

torus el torus por:

var geometryTorus = new THREE.TorusGeometry( radius, 2*widthLine, 100, 100 ); var materialLine = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); torus = new THREE.Mesh( geometryTorus, materialLine ); scene.add(torus);

Mi problema es que la rotación a lo largo del Ox axis funciona bien, pero este no es el caso para la rotación a lo largo del Oz axis .

Hago las rotaciones para torus llamando a la siguiente función:

// Change great circle parameters function changeGreatCircle(thetax, thetaz) { // Update rotation angles torus.rotation.x = thetax; torus.rotation.z = thetaz; }

Para la función anterior, render(''init'') función render(''init'') en la que calculo la posición de la cámara.

Cómo hacer girar este toro a lo largo del Oz axis ? ¿Por qué gira a lo largo del Ox axis y no a lo largo del Oz axis ?

Si alguien pudiera dar pistas, estaría bien.

Gracias

ACTUALIZACIÓN 1:

Encontré una solución porque no tenía en cuenta los Euler angles , es decir, el orden de las 2 rotaciones (alrededor de los ejes X e Y ). La solución fue establecer torus.rotation.order = ''ZXY'';


He creado un violín que demuestra que los tres componentes de mesh.rotation funcionan bien. En función de lo que se puede encontrar en TRES código fuente, las siguientes cosas ocurren cuando configura la rotación de Object3D (y, respectivamente, Mesh):

  1. En TRES.Objeto3D : quaternion.setFromEuler( rotation, false ); sucede.
  2. En TRES.Quaternion y THREE.Euler (nuestros componentes mesh.rotation son ángulos de Euler ) podríamos ver que la rotación depende del orden de aplicación. Orden de rotación por defecto en THREE.Euler es ''XYZ'' .
  3. El programa de sombreado estándar en TRES toma la transformación del objeto como matriz. En THREE.Object3D, puede ver this.matrix.compose( this.position, this.quaternion, this.scale ); llamada.
  4. Esta transformación se aplica a la transformación padre de objetos para obtener object.matrixWorld que se usa para dibujar.

Así que hablando de su problema: aplica rotación en toro y cámara en diferentes ejes, es por eso que la cámara no sigue al toro (y el toro no está fijo en relación con el espacio mundial, entonces usted cambia torus.rotation.z ). Tenga en cuenta que las rotaciones se aplican en serie.

Si no se puede lograr el comportamiento deseado insertando objetos ficticios y ajustando el orden de rotaciones, podría construir su propio material y pasar más parámetros como uniformes para usar en el programa de sombreado. En este caso, no es necesario sin embargo.

Si esto no ayuda, construya un ejemplo mínimo que demuestre su problema.