WebXR camera position and rotation issue?

Questions
1

Hi All,

In my WebXR projects, I previously utilized a method wherein I created a weapon object attached to the 3D camera by designating it as a child of the camera3D (for example, camera3d.add(weapon)). This approach yielded consistent results akin to those in a Three.js 3D scene even within the WebXR environment.

However, it has come to my attention that WebXR has undergone significant changes in recent months, particularly concerning the movement and rotation of the 3D camera. While objects attached to the 3D camera remain properly affixed in a standard 3D scene, the behavior becomes erratic and unpredictable upon transitioning to the WebXR mode.

I am in search of a solution to replicate a scene as a simplistic “box,” perpetually positioned in front of the 3D camera, in both the conventional Three.js rendering and WebXR mode.

Any suggestments or tutorial or examples ?

regards,

Mauro

2

I just figured out how to get position and rotation of camera view:

// camera3d is the threejs camera:

currentSession.requestReferenceSpace(‘local’).then(function (referenceSpace) {

let xrReferenceSpace = referenceSpace;

let updateXRFrame = function( time, frame ){
	
	if ( frame ){
		
		const xrPose = frame.getViewerPose( xrReferenceSpace );
		
		if ( xrPose !== undefined && xrPose !== null ){
			
			var position = xrPose.views[0].transform.position;
			var rotation = xrPose.views[0].transform.orientation;

			camera3d.position.set(position.x, position.y, position.z);
			camera3d.quaternion.set(rotation.x, rotation.y, rotation.z, rotation.w);
			camera3d.updateMatrixWorld();

		};
		
	};

	currentSession.requestAnimationFrame( updateXRFrame );

};

currentSession.requestAnimationFrame( updateXRFrame );

});

Hope it can help

M.

1 Like