XRWebGLSubImage.colorTexture

The read-only colorTexture property of the XRWebGLSubImage interface represents the color WebGLTexture object for the XRCompositionLayer to render.

Value

An opaque WebGLTexture. See WebXR opaque textures for details.

Examples

Using `colorTexture`

The colorTexture property can be passed to WebGL2RenderingContext.framebufferTextureLayer() to attach the color texture to a framebuffer.

const xrGlBinding = new XRWebGLBinding(xrSession, gl);
const layer = xrGlBinding.createProjectionLayer({ textureType: "texture-array" });
const framebuffer = gl.createFramebuffer();

xrSession.updateRenderState({ layers: [layer] });
xrSession.requestAnimationFrame(onXRFrame);

function onXRFrame(time, xrFrame) {
  xrSession.requestAnimationFrame(onXRFrame);

  gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
  let viewport = xrGlBinding.getSubImage(layer, xrFrame).viewport;
  gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height);

  for (let view in xrViewerPose.views) {
    let subImage = xrGlBinding.getViewSubImage(layer, view);
    gl.framebufferTextureLayer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0,
      subImage.colorTexture, 0, subImage.imageIndex);
    gl.framebufferTextureLayer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT,
      subImage.depthStencilTexture, 0, subImage.imageIndex);

    // Render from the viewpoint of xrView
  }
}

Specifications

No specification found

No specification data found for api.XRWebGLSubImage.colorTexture.
Check for problems with this page or contribute a missing spec_url to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Browser compatibility

No compatibility data found for api.XRWebGLSubImage.colorTexture.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.