How can I get camera world direction with webxr?

Question

I would like to use camera.getWorldDirection() and access to the head-mounted display directions. I was able to do this with the previous webVR API. When I use the new HelioWebXRPolyfill.js from THREE, I am not able to receive current positions.

Answer 1

It seems that calling renderer.xr.getCamera() isn't fully copying the various camera member properties that camera.getWorldDirection() is expecting to find. I'm not sure where this problem originates (perhaps the polyfill?), but you can get around it by computing direction yourself :

        let xrCamera = this.renderer.xr.getCamera(sceneCamera)
        let e = xrCamera.matrixWorld.elements
        let direction = new THREE.Vector3(-e[8], -e[9], -e[10]).normalize()

Answer 2

I came up with a simple fix. Just parent a box to the camera and use the camera box in place of the camera.

camera.add( camerabox );

This doesn't work:

var direction = new THREE.Vector3();
camera.getWorldDirection( direction );

This DOES work:

var direction = new THREE.Vector3();
camerabox.getWorldDirection( direction );

Answer 3

According to the WebXR Device API, this should be done using the XRViewerPose object.

This feature is only working using HTTPS.

Answer 4

global variable

var cameraVector = new THREE.Vector3();  //define once and reuse it!

in your render loop

let xrCamera = renderer.xr.getCamera(camera);
xrCamera.getWorldDirection(cameraVector);
//heading vector for webXR camera now within cameraVector