XRWebGLBinding: createProjectionLayer() method
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The createProjectionLayer()
method of the XRWebGLBinding
interface returns an XRProjectionLayer
object which is a layer that fills the entire view of the observer and is refreshed close to the device's native frame rate.
Syntax
createProjectionLayer(options)
Parameters
options
-
An object to configure the
XRProjectionLayer
.textureType
Optional-
An string defining the type of texture the layer will have. Possible values:
texture
-
The textures of
XRWebGLSubImage
will be of typegl.TEXTURE_2D
. texture-array
-
The textures of
XRWebGLSubImage
will be of typegl.TEXTURE_2D_ARRAY
(WebGL 2 contexts only). The default value istexture
.
colorFormat
Optional-
A
GLenum
defining the data type of the color texture data. Possible values:gl.RGB
-
gl.RGBA
Additionally, for contexts with theEXT_sRGB
extension enabled: ext.SRGB_EXT
-
ext.SRGB_ALPHA_EXT
Additionally, forWebGL2RenderingContext
contexts: gl.RGBA8
gl.RGB8
gl.SRGB8
-
gl.RGB8_ALPHA8
The default value isgl.RGBA
.
depthFormat
Optional-
A
GLenum
defining the data type of the depth texture data or0
indicating that the layer should not provide a depth texture. (In that caseXRProjectionLayer.ignoreDepthValues
will betrue
.) Possible values withinWebGLRenderingContext
contexts with theWEBGL_depth_texture
extension enabled, or withinWebGL2RenderingContext
contexts (no extension required):gl.DEPTH_COMPONENT
-
gl.DEPTH_STENCIL
Additionally, forWebGL2RenderingContext
contexts: gl.DEPTH_COMPONENT24
-
gl.DEPTH24_STENCIL24
The default value isgl.DEPTH_COMPONENT
.
scaleFactor
Optional-
A floating-point value which is used to scale the layer during compositing. A value of
1.0
represents the default pixel size for the frame buffer. (See alsoXRWebGLLayer.getNativeFramebufferScaleFactor()
.) Unlike other layers, theXRProjectionLayer
can't be created with an explicit pixel width and height, because the size is inferred by the hardware. (Projection layers fill the observer's entire view.)
Return value
An XRProjectionLayer
object.
Examples
Creating an XRProjectionLayer
in a WebGL 2 context
The textureType
option allows allocating a texture array instead, in which every XRView
will be rendered into a separate level of the array. This allows for some rendering optimizations, such as the use of the OVR_multiview2
extension available in WebGL 2 contexts.
function onXRSessionStarted(xrSession) {
const glCanvas = document.createElement("canvas");
const gl = glCanvas.getContext("webgl2", { xrCompatible: true });
const xrGlBinding = new XRWebGLBinding(xrSession, gl);
const projectionLayer = xrGlBinding.createProjectionLayer({
textureType: "texture-array",
});
xrSession.updateRenderState({
layers: [projectionLayer],
});
}
Specifications
Specification |
---|
WebXR Layers API Level 1 # dom-xrwebglbinding-createprojectionlayer |
Browser compatibility
BCD tables only load in the browser