XRRay

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Secure context: This feature is available only insecure contexts (HTTPS), in some or allsupporting browsers.

Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.

TheXRRay interface of theWebXR Device API is a geometric ray described by an origin point and a direction vector.

XRRay objects can be passed toXRSession.requestHitTestSource() orXRSession.requestHitTestSourceForTransientInput() to perform hit testing.

Constructor

XRRay()Experimental: Creates a newXRRay object.

Instance properties

XRRay.directionRead onlyExperimental: A DOMPointReadOnly representing the ray's 3-dimensional directional vector.
XRRay.matrixRead onlyExperimental: A transform that can be used to position objects along theXRRay. This is a 4 by 4 matrix given as a 16 element Float32Array in column major order.
XRRay.originRead onlyExperimental: A DOMPointReadOnly representing the 3-dimensional point in space that the ray originates from, in meters.

TheXRSession.requestHitTestSource() method takes anXRRay object for itsoffsetRay option. In this example, the hit test source is positioned slightly above the viewer as the application has some UI elements at the bottom while wanting to maintain the perception of a centered cursor.

const xrSession = navigator.xr.requestSession("immersive-ar", {  requiredFeatures: ["local", "hit-test"],});let hitTestSource = null;xrSession  .requestHitTestSource({    space: viewerSpace, // obtained from xrSession.requestReferenceSpace("viewer");    offsetRay: new XRRay({ y: 0.5 }),  })  .then((viewerHitTestSource) => {    hitTestSource = viewerHitTestSource;  });