XRRenderState: baseLayer property

A XRWebGLLayer object which is used as the source of the world's contents when rendering each frame of the scene.

See the examples below to see how to use updateRenderState() to set the current XRWebGLLayer used for rendering the scene.

You can set the XRWebGLLayer used for rendering by calling updateRenderState(), like this:

let canvas = document.querySelector("canvas");
gl = canvas.getContext("webgl", { xrCompatible: true });
setNewWebGLLayer();

function setNewWebGLLayer(gl) {
  if (!gl) {
    /* WebGL not available */
    return;
  }

  xrSession.updateRenderState({
    baseLayer: new XRWebGLLayer(xrSession, gl),
  });
}

Here, the canvas obtained in the first line is the canvas into which WebGL is going to draw. That context is passed into new XRWebGLLayer() to create an XRWebGLLayer which uses the contents of the WebGL context gl as the source of the world's image during presentation.