Me gustaría establecer la rotación horizontal y vertical inicial de una PerspectiveCamera
que luego usa OrbitControl
. Intenté llamar a .rotateX(X) .rotateY(Y)
en PerspectiveCamera
pero parece que no funciona.
En los documentos de threejs en el ejemplo de OrbitControl, dicen
//controls.update() must be called after any manual changes to the camera's transform camera.position.set( 0, 20, 100 ); controls.update();
https://tresjs.org/docs/#examples/en/controls/OrbitControls
Me gustaría hacer lo mismo pero con la rotación horizontal y vertical.
Aquí está el código relevante:
cámara.js
import { PerspectiveCamera } from 'three' import { tweakParams } from 'src/World/utils/twekParams' function createCamera () { const camera = new PerspectiveCamera( 35, 1, 0.1, 100 ) camera.userData.setInitialTransform = () => { // Grab the initial position and rotation values from a Singleton (tweakParams) const cameraPosition = tweakParams.camera.transform.position const cameraRotation = tweakParams.camera.transform.rotation camera.position.set(cameraPosition.x, cameraPosition.y, cameraPosition.z) camera.rotateX(cameraRotation.x) camera.rotateY(cameraRotation.y) } return camera } export { createCamera }
controles.js
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls' function createControls (camera, canvas, { enablePan = true, autoRotate = false } = {}) { const controls = new OrbitControls(camera, canvas) controls.enableDamping = true controls.enablePan = enablePan controls.autoRotate = false controls.autoRotateSpeed = 0.25 controls.maxDistance = 30 camera.userData.setInitialTransform() controls.update() // This function gets called in the animation Loop. controls.tick = () => controls.update() return controls } export { createControls }
Y aquí está el singleton que contiene los valores de transformación iniciales de la cámara.
export const tweakParams = { camera: { transform: { position: { x: 6.83487313982359, y: 9.164636749995928, z: 13.384934657461855 }, rotation: { x: Math.PI * 0.5, y: Math.PI * 0.5 } } } }
Este singleton tiene valores ficticios por ahora, pero en el futuro debería completarse con los últimos atributos de transformación que tenía la cámara antes de salir de la página actual.
De todos modos, la posición inicial de la cámara funciona bien, pero no la rotación. Alguna idea de como resolver esto?
La rotación de PerspectiveCamera
no funciona con OrbitControls. Esto se debe a que OrbitControls sobrescribe la rotación de la cámara .
Para resolver esto, utilicé OrbitControls.target
, que hace que la cámara en perspectiva orbite alrededor de las coordenadas de este objetivo.