OrbitControls stop working when grouping camera for XR

I have just added my camera to a group so I can set its position in VR in the demo below:

https://xr.webvr.dev/ex/three.js/points2/ex8.html

VR works, which is great, but now OrbitControls doesn’t work.

Here’s the previous version where it worked:

Is it obvious to any of you why this stopped working? I assume it’s something I just don’t understand.

Thanks,
Austin

Oh, this is probably a clue (source)

object: (required) The camera to be controlled. The camera must not be a child of another object, unless that object is the scene itself.

So by placing the camera into a Group, I probably break it. To me, this implies that OrbitControls and positioning the VR camera are mutually exclusive. Is there some workaround?

1 Like

I haven’t come back to this project yet, but I’ve been thinking about solutions. Could I only put the camera in the group when entering VR mode? Or … could I have two cameras, one for 2D and one for 3D and switch between them?

Anyone has come up with a solution yet?

I still haven’t come back to this project. I was hoping someone more knowledgable would chime in.

Yeah use another camera until entering VR, or a potential sudo idea would be to have a ghost secondary camera with orbit controls on it and apply this ghost camera matrix to the parent group containing your primary camera (maybe?)

I think that you should not try to use “OrbitControls” when entering VR, and instead implement an alternate method of manipulating the scene that makes use of the VR controllers. GoogleEarth VR provides a good example of how a scene can be navigated with your controllers.

I implemented a custom solution in this project.
Game : Ball-VR
Source : Sean-Bradley/Ball-VR: A ball rolling experiment in VR (github.com)
You use the controllers to rotate around the ball, roll forward/backward and change direction.
Only tested on Quest (and dekstop).

Ball-VR Demo

1 Like

Hi, I was facing the same issue. Below is my workaround, so that while using VR your OrbitControls in normal mode are still working!

/** add vr support */
  private setupVR(): void {
    /** position vr camera w.r.t. actual camera on session start */
    this.renderer.xr.addEventListener("sessionstart", (e) => {
      this.cameraGroup.position.set(this.camera.position.x, this.camera.position.y, this.camera.position.z);
      this.cameraGroup.quaternion.set(this.camera.quaternion.x, this.camera.quaternion.y, this.camera.quaternion.z, this.camera.quaternion.w);
      this.camera.position.set(0, 0, 0);
      this.camera.quaternion.set(0, 0, 0, 1);
    });
    /** revert back actual camera position when vr is turned off */
    this.renderer.xr.addEventListener("sessionend", (e) => {
      this.camera.position.set(this.cameraGroup.position.x, this.cameraGroup.position.y, this.cameraGroup.position.z);
      this.camera.quaternion.set(this.cameraGroup.quaternion.x, this.cameraGroup.quaternion.y, this.cameraGroup.quaternion.z, this.cameraGroup.quaternion.w);
      this.cameraGroup.position.set(0, 0, 0);
      this.cameraGroup.quaternion.set(0, 0, 0, 1);
    });
    this.renderer.xr.enabled = true;
    document.body.appendChild(VRButton.createButton(this.renderer));
  }