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 in secure contexts (HTTPS), in some or all supporting browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The XREquirectLayer interface of the WebXR Device API is a layer that maps equirectangular coded data onto the inside of a sphere.
XREquirectLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().
To create a new XREquirectLayer, call either:
XRWebGLBinding.createEquirectLayer() for a WebGL opaque texture layer, orXRMediaBinding.createEquirectLayer() for an HTML <video> playback layer.To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState().
Inherits properties from its parent, XRCompositionLayer.
XREquirectLayer.centralHorizontalAngle Experimental
A number indicating the central horizontal angle in radians for the sphere.
XREquirectLayer.lowerVerticalAngle Experimental
A number indicating the lower vertical angle in radians for the sphere.
XREquirectLayer.radius Experimental
A number indicating the radius of the sphere.
XREquirectLayer.space Experimental
An XRSpace representing the layer's spatial relationship with the user's physical environment.
XREquirectLayer.transform Experimental
An XRRigidTransform representing the offset and orientation relative to space.
XREquirectLayer.upperVerticalAngle Experimental
A number indicating the upper vertical angle in radians for the sphere.
Inherits methods from its parents, XRCompositionLayer and EventTarget.
redraw Experimental
Sent to the XREquirectLayer object when the underlying resources of the layer are lost or when the XR Compositor can no longer reproject the layer. If this event is sent, authors should redraw the content of the layer in the next XR animation frame.
| Specification |
|---|
| WebXR Layers API Level 1> # xrequirectlayertype> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
XREquirectLayer |
No | No | No | No | No | No | No | No | No | No | No | No |
centralHorizontalAngle |
No | No | No | No | No | No | No | No | No | No | No | No |
lowerVerticalAngle |
No | No | No | No | No | No | No | No | No | No | No | No |
radius |
No | No | No | No | No | No | No | No | No | No | No | No |
redraw_event |
No | No | No | No | No | No | No | No | No | No | No | No |
space |
No | No | No | No | No | No | No | No | No | No | No | No |
transform |
No | No | No | No | No | No | No | No | No | No | No | No |
upperVerticalAngle |
No | No | No | No | No | No | No | No | No | No | No | No |
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/XREquirectLayer