XRWebGLLayer

XRWebGLLayer() 实验性

创建并返回一个新的 XRWebGLLayer 对象，供指定的 XRSession 使用，使用特定的 WebGLRenderingContext 或 WebGL2RenderingContext 作为目标上下文。

antialias 只读 实验性

一个布尔值，指示 WebGL 上下文的帧缓冲区是否支持抗锯齿。 抗锯齿的具体类型由 用户代理 决定。

fixedFoveation 实验性

一个数字，指示 XR 合成器使用的注视点渲染量。 固定注视点渲染 (FFR) 以比中心更低的解析度渲染眼睛纹理的边缘，并减少 GPU 负载。

framebuffer 只读 实验性

返回一个 WebGLFramebuffer，适合传递到 bindFrameBuffer() 方法中。

framebufferWidth 只读 实验性

返回 XRWebGLLayer 的帧缓冲区的宽度。

framebufferHeight 只读 实验性

返回层的帧缓冲区的高度。

ignoreDepthValues 只读 实验性

一个布尔值，指示WebXR 合成器 在合成场景时是否应使用层的深度缓冲区的内容。

getNativeFramebufferScaleFactor() 实验性

返回可以用来将推荐的 WebGL 帧缓冲区分辨率缩放至渲染设备的本机分辨率的缩放因子。

getViewport() 实验性

返回一个新的 XRViewport 实例，表示 WebGL 上下文的视口必须设置为包含绘制到为指定视图的内容分配的帧缓冲区区域的位置、宽度和高度。 这样，例如，左眼视点的渲染和右眼视点的渲染分别放置到帧缓冲区的正确部分。

此代码段摘自我们“运动和运动”WebXR 示例中的绘制帧，展示了如何从 XRSession 对象的渲染状态获取 XRWebGLLayer，然后通过调用 WebGL bindFrameBuffer() 函数将其绑定为当前渲染 WebGL 帧缓冲区。

let glLayer = xrSession.renderState.baseLayer;
gl.bindFrameBuffer(gl.FRAMEBUFFER, glLayer.framebuffer);

每次 GPU 准备好将场景渲染到 XR 设备时，XR 运行时会调用您在调用 XRSession 方法 requestAnimationFrame() 时指定的函数来请求渲染帧。

该函数以 XRFrame 作为输入，该对象封装了渲染帧所需的数据。这些信息包括姿势（一个 XRViewerPose 对象），描述了查看者在场景中的位置和朝向，以及一个 XRView 对象列表，每个对象代表场景的一个视角。在当前的 WebXR 实现中，该列表中永远不会超过两个条目：一个描述左眼的位姿和视角，另一个描述右眼。

let pose = xrFrame.getViewerPose(xrReferenceSpace);

if (pose) {
  const glLayer = xrSession.renderState.baseLayer;
  gl.bindFrameBuffer(gl.FRAMEBUFFER, glLayer.Framebffer);

  for (const view of pose.views) {
    const viewport = glLayer.getViewport(view);
    gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height);

    /* Render the view */
  }
}

• WebXR 设备 API
• WebGL 入门
• WebGLRenderingContext 和 WebGL2RenderingContext
• 在我们的“运动和移动”WebXR 示例中 绘制帧