Layers (WebXR)

WebXR layer types, such as XRCylinderLayer, XRCylinderLayer, XREquirectLayer, XRProjectionLayer or XRQuadLayer, are managed by the system compositor, to reduce latency or resampling.

Baseline Status: This feature is currently Limited and is missing in at least one major browser engine.

Desktop Browser Engine Support

Google Chrome

147

Supported

Mozilla Firefox

—

Unsupported

Apple Safari

—

Unsupported

Microsoft Edge

147

Supported

Mobile Browser Engine Support

Chrome Android

147

Firefox Android

—

Safari iOS

—

Specifications and References

Specification ↗ Feature XML ↗

MDN Browser Compat Data Keys:

api.XRCompositionLayer ↗ api.XRCompositionLayer.blendTextureSourceAlpha ↗ api.XRCompositionLayer.destroy ↗ api.XRCompositionLayer.layout ↗ api.XRCompositionLayer.mipLevels ↗ api.XRCompositionLayer.needsRedraw ↗ api.XRCubeLayer ↗ api.XRCubeLayer.orientation ↗ api.XRCubeLayer.redraw_event ↗ api.XRCubeLayer.space ↗ api.XRCylinderLayer ↗ api.XRCylinderLayer.aspectRatio ↗ api.XRCylinderLayer.centralAngle ↗ api.XRCylinderLayer.radius ↗ api.XRCylinderLayer.redraw_event ↗ api.XRCylinderLayer.space ↗ api.XRCylinderLayer.transform ↗ api.XREquirectLayer ↗ api.XREquirectLayer.centralHorizontalAngle ↗ api.XREquirectLayer.lowerVerticalAngle ↗ api.XREquirectLayer.radius ↗ api.XREquirectLayer.redraw_event ↗ api.XREquirectLayer.space ↗ api.XREquirectLayer.transform ↗ api.XREquirectLayer.upperVerticalAngle ↗ api.XRLayerEvent ↗ api.XRLayerEvent.XRLayerEvent ↗ api.XRLayerEvent.layer ↗ api.XRMediaBinding ↗ api.XRMediaBinding.XRMediaBinding ↗ api.XRMediaBinding.createCylinderLayer ↗ api.XRMediaBinding.createEquirectLayer ↗ api.XRMediaBinding.createQuadLayer ↗ api.XRProjectionLayer ↗ api.XRProjectionLayer.fixedFoveation ↗ api.XRProjectionLayer.ignoreDepthValues ↗ api.XRProjectionLayer.textureArrayLength ↗ api.XRProjectionLayer.textureHeight ↗ api.XRProjectionLayer.textureWidth ↗ api.XRQuadLayer ↗ api.XRQuadLayer.height ↗ api.XRQuadLayer.redraw_event ↗ api.XRQuadLayer.space ↗ api.XRQuadLayer.transform ↗ api.XRQuadLayer.width ↗ api.XRRenderState.layers ↗ api.XRSubImage ↗ api.XRSubImage.viewport ↗ api.XRWebGLBinding ↗ api.XRWebGLBinding.XRWebGLBinding ↗ api.XRWebGLBinding.createCubeLayer ↗ api.XRWebGLBinding.createCylinderLayer ↗ api.XRWebGLBinding.createEquirectLayer ↗ api.XRWebGLBinding.createProjectionLayer ↗ api.XRWebGLBinding.createQuadLayer ↗ api.XRWebGLBinding.getSubImage ↗ api.XRWebGLBinding.getViewSubImage ↗ api.XRWebGLBinding.nativeProjectionScaleFactor ↗ api.XRWebGLSubImage ↗ api.XRWebGLSubImage.colorTexture ↗ api.XRWebGLSubImage.colorTextureHeight ↗ api.XRWebGLSubImage.colorTextureWidth ↗ api.XRWebGLSubImage.depthStencilTexture ↗ api.XRWebGLSubImage.imageIndex ↗