Tweening camera.fov in VR?

Questions
,
1

Hello!

I’m working on a mobile VR application where I’d like to tween the .fov parameter of the camera. I’m using the Tween.js library, and the tweening looks like this:

var tweenRoomOut = new TWEEN.Tween(camera)
.to({fov: 110},1000)
.easing(TWEEN.Easing.Linear.None)
.onUpdate( () => {})
.onComplete( () => {})
.start();

This works very well, both on a computer browser and in mobile, when the application is not in VR mode, but when I switch to the VR camera, the tweens no longer do anything.

The vr camera is a THREE.PerspectiveCamera and i’m making sure to update the camera in my update loop:

camera.updateProjectionMatrix();

What am i missing?

2

camera.fov is ignored in VR. We use the fov information the headset gives us.

3

Thanks @mrdoob

What would you recommend, if that’s the effect i’m going for? Is there a way to override this behavior?

Alternatively:
In my application, the camera is at 0,0,0 and there is a sphere with an image texture also centered at 0,0,0 . I can get a similar effect as tweening the fov if i move the sphere towards and away from the camera. I do it by first getting the camera look at world direction, and then moving the sphere in that direction:

    var vector = new THREE.Vector3(0,0,0);
    this.camera.getWorldDirection( vector );
    var tweenRoomOut = new TWEEN.Tween(this.sphereMesh.position).to({
        x: -1 * vector.x * 100,
        y: -1 * vector.y * 100,
        z: -1 * vector.z * 100
    },1000).easing(TWEEN.Easing.Linear.None).onUpdate( () => {})
   .onComplete( () => {})
   .start();

However, I’m finding that this too behaves different with the VR camera; instead of moving towards or away from the camera, the sphere moves sideways in VR mode.

What am I missing in this case?

4

What would you recommend, if that’s the effect i’m going for? Is there a way to override this behavior?

Hmm… Maybe modifying camera.scale works?

However, I’m finding that this too behaves different with the VR camera; instead of moving towards or away from the camera, the sphere moves sideways in VR mode.

The camera position and rotation gets overwritten by the headset position and rotation. Add you camera to a group and animate the group instead.

5

Hmm… Maybe modifying camera.scale works?

this seems like a good idea.
I don’t see any mention of ‘camera.scale’ in the perspecrive camera documentation:
https://threejs.org/docs/#api/cameras/PerspectiveCamera

when i try to change the camera.scale, i don’t see any effect.
is it done like this:

camera.scale.set(1)

?

The camera position and rotation gets overwritten by the headset position and rotation. Add you camera to a group and animate the group instead.

It seems like your suggest would apply to situations when one is modifying the camera (or a group that the camera is a part of). In the example I provided, I’m actually not modifying the camera position, but rather the position of a sphere mesh that is around the camera; in this setup, i notice that moving the sphere in the direction of the camera look-at vector behaves differently in Vr mode and non VR mode. My question is, why would moving a geometry (not the camera) in the direction of the camera look at behave differently in VR mode and not? What I conclude is that this is returning different values for Vr mode and not:

this.camera.getWorldDirection( vector );

so, how do i get the real camera world direction, in VR mode?

6

Cameras inherit from Object3D and scale is defined there. It’s a Vector3, so you can do

camera.scale.set(1, 1, 1)

7

Ah! Interesting… I may be able to fix that…

8

Oh great. Please let me know if you’d like me to that something.

I also discovered that the camera has a “zoom” property. Would you expect this to work in VR mode or is it also overwritten, like the “fov” property?

9

I have confirmed that the ‘zoom’ property also only works in non-VR mode.