XRWebGLBinding：createCubeLayer() 方法

语法

createCubeLayer(init)

参数

init

一个用于配置 XRCubeLayer 的对象。它必须具有 space、viewPixelHeight 和 viewPixelWidth 属性。init 具有以下属性

colorFormat 可选

一个 GLenum，用于定义颜色纹理数据的类型。可能的值：

• gl.RGB
• gl.RGBA (默认) 此外，对于启用了 EXT_sRGB 扩展的上下文
• ext.SRGB_EXT
• ext.SRGB_ALPHA_EXT 此外，对于 WebGL2RenderingContext 上下文：
• gl.RGBA8
• gl.RGB8
• gl.SRGB8
• gl.RGB8_ALPHA8 此外，对于启用了 WEBGL_compressed_texture_etc 扩展的上下文：
• ext.COMPRESSED_RGB8_ETC2
• ext.COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2
• ext.COMPRESSED_RGBA8_ETC2_EAC
• ext.COMPRESSED_SRGB8_ETC2
• ext.COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2
• ext.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC 此外，对于启用了 WEBGL_compressed_texture_astc 扩展的上下文：
• 该扩展支持的所有 格式。

depthFormat 可选

一个 GLenum，用于定义深度纹理数据的类型，或者 0 表示图层不提供深度纹理。（在这种情况下，XRProjectionLayer.ignoreDepthValues 将为 true。）对于启用了 WEBGL_depth_texture 扩展的 WebGLRenderingContext 上下文，或者对于 WebGL2RenderingContext 上下文（无需扩展），可能的值为

• gl.DEPTH_COMPONENT (默认)
• gl.DEPTH_STENCIL 此外，对于 WebGL2RenderingContext 上下文：
• gl.DEPTH_COMPONENT24
• gl.DEPTH24_STENCIL24

isStatic 可选

一个布尔值，如果为 true，则表示您只能在该图层的 needsRedraw 为 true 时进行绘制。默认值为 false。

layout

一个字符串，指示图层的布局。可能的值：

• default：图层适应会话的所有视图。
• mono：分配一个 XRSubImage 并将其呈现给双眼。
• stereo：用户代理决定如何分配 XRSubImage（一个或两个）以及布局（上下或左右）。
• stereo-left-right：分配一个 XRSubImage。左眼获取纹理的左侧区域，右眼获取右侧区域。
• stereo-top-bottom：分配一个 XRSubImage。左眼获取纹理的顶部区域，右眼获取底部区域。默认值为 mono。

mipLevels 可选

一个指定所需 mip 级别的数量。默认值为 1。

orientation 可选

一个 DOMPointReadOnly，指定相对于 space 属性的方向。

space 必需

一个 XRSpace 对象，定义了图层与用户物理环境的空间关系。

viewPixelHeight 必需

一个数字，指定图层视图的像素高度。

viewPixelWidth 必需

一个数字，指定图层视图的像素宽度。

返回值

一个 XRCubeLayer 对象。

示例

创建 XRCubeLayer

在调用 createCubeLayer() 时，使用上方列出的属性配置立方体图层。要将图层呈现给 XR 设备，请使用 XRSession.updateRenderState() 将其添加到 layers 渲染状态中。

function onXRSessionStarted(xrSession) {
  const glCanvas = document.createElement("canvas");
  const gl = glCanvas.getContext("webgl2", { xrCompatible: true });
  const xrGlBinding = new XRWebGLBinding(xrSession, gl);
  const cubeLayer = xrGlBinding.createCubeLayer({
    space: xrReferenceSpace,
    viewPixelHeight: 512,
    viewPixelWidth: 512,
  });
  xrSession.updateRenderState({
    layers: [cubeLayer],
  });
}

规范

浏览器兼容性

另见

• XRCubeLayer
• WebGL 常量