I want to reset the camera orientation to it initial orientation on entering VR or by clicking a button using three.js. In OrbitControls there is a function to reset camera orientaion and position to initial state.I want to do something just like it.
orbitcontrols.reset();
In previous three.js version there was a function to reset VR camera orientaion.
controls.resetPose();
But this function is not available now.
Can anybody please help me with how to reset VR camera orientaion and position to initial state?
Related
I'm trying to sync the camera orientation of one threejs scene with another by passing the world matrix of the first scene's camera to the second and then using
camera.matrix.fromArray(cam1array); //cam1array is the flattened worldmatrix of the 1st scene
camera.updateMatrixWorld( true );
However, when I print camera.matrixWorld for the second scene, it would appear that there has been no update (matrixWorld is the same as before the previous commands). The second scene does use OrbitControls so maybe they are overriding my commands, but I wondered if anyone could advise me on how to achieve the same world matrix for the second scene as the first?
I should also clarify that part of the issue is that it would appear that setting
camera.matrixAutoUpdate = false;
in order to prevent overriding seems to prevent OrbitControls from functioning corrrectly.
I am building an A-Frame application and when in VR mode I can use the keyboard WASD to navigate and look up or down with movement to change camera height. The camera is facing forward except when I rotate my head in Oculus rift which works fine. In some Oculus apps such as home when you teleport you can rotate the thumbstick so that the direction you face changes after you teleport. Is there a way to change camera rotation with the keyboard in A-frame? I am using A-frame extras and my camera rig code is below. Thanks!
<a-entity id="rig" movement-controls="fly: true; speed: 0.1" wasd-controls position="11 1.5 2" >
<a-entity camera look-controls></a-entity>
</a-entity>
Add a rotation component to the id='rig' entity. Then you can make a new custom component ('overrotate'), and also add that to the id='rig' entity. Program overrotate to listen for keyboard input (whatever keys you like), and within that listener function, call the rotation component with a setAttribute(). Because you are now rotating the parent of the camera (the rig), you will still get your look-controls rotation of the camera, and also the override rotation for the rig, driven by keyboard input.
I am trying to create a First person view in A-frame using the .obj model of a car.
The camera has been positioned close to the driver's seat, and there is a timed interval in javascript that moves the camera position by doing trignometric calculations and moves the camera accordingly.
Here are two problems I am facing
1) How do you make this smoother? Is there a hook for the render loop in A-frame which can be accessed in javascript? I cant seem to find the documentation for it.
2) When I view the above page in VR mode on the phone ( Android 9), the animation created stops abruptly, which works well in fullscreen mode.
The code for the html is here https://raw.githubusercontent.com/CuriosityGym/VRWithAframe/master/templates/class3-models.html
The example can be accessed here http://cgaframe.herokuapp.com/class3
Thank You!
You have a setInterval that fires every 100ms, animating the car at 10fps. That’s why it’s not smooth. Create a component and use the tick method to animate
In addition, you should not animate the camera directy because its position will be overriden by the headset pose in VR mode. Setup and animate a camera rig
I am developing a web application that uses 3d buildings as models. I want to create a button that places the camera so that the model is in a suitable position, however when I rotate the camera manually the mouse control resets it again.
Sample here:Link
If I enable //controls.update() the rotation doesn't work. With //controls.update() disabled the camera rotate fine but when I use the mouse, the camera is reset.
¿What can I do? Thanks!
You shouldn't directly change the rotation of the camera, instead you should change the position+target.
When you call controls.update() the rotation of the camera will be calculated based on the position of the camera (the location of the camera) and the target of the controls (the location of focus).
For example you can do:
controls.target.set(0,0,1);
camera.position.set(-0.041, 1.9, -1.21);
controls.update();
using threeJS to create a sphere with a 360 image.
init with:
this.controls = new THREE.DeviceOrientationControls(this.camera, true);
and on click I change controls to OrbitControls.
Is there a way to keep/find current camera position?
results achieved by combining DeviceOrientationControls and OrbitControls, together with controls enable/disable toggle, below.
this.controls.enabled = !this.controls.enabled;