XRWebGLBinding：createEquirectLayer() 方法

语法

createEquirectLayer(options)

参数

options

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

centralHorizontalAngle 可选

一个数字，表示球体的中心水平角度（以弧度为单位）。默认值为 6.28318 (2π)。

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 扩展的上下文：
• 扩展支持的 *所有* 格式。默认值为 gl.RGBA。

depthFormat 可选

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

• gl.DEPTH_COMPONENT
• gl.DEPTH_STENCIL 此外，对于 WebGL2RenderingContext 上下文：
• gl.DEPTH_COMPONENT24
• gl.DEPTH24_STENCIL24 默认值为 gl.DEPTH_COMPONENT。

isStatic 可选

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

layout 可选

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

default

该图层支持会话的所有视图。

mono

分配一个 XRSubImage 对象，并将其呈现给双眼。

stereo

用户代理决定如何分配 XRSubImage（一个或两个）以及布局（上下或左右）。

stereo-left-right

分配一个 XRSubImage 对象。左眼使用纹理的左侧区域，右眼使用右侧区域。

stereo-top-bottom

分配一个 XRSubImage 对象。左眼使用纹理的上侧区域，右眼使用下侧区域。默认值为 mono。

lowerVerticalAngle 可选

一个数字，表示球体的较低垂直角度（以弧度为单位）。默认值为 -1.570795 (-π/2)。

mipLevels 可选

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

radius 可选

一个数字，表示球体的半径。默认值为 0（无限球体）。

space 必需

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

textureType 可选

一个字符串，定义了图层的纹理类型。可能的值：

texture

XRWebGLSubImage 的纹理类型为 gl.TEXTURE_2D。

texture-array

XRWebGLSubImage 的纹理类型为 gl.TEXTURE_2D_ARRAY（仅限 WebGL 2 上下文）。默认值为 texture。

transform 可选

一个 XRRigidTransform 对象，定义了相对于 space 的偏移和方向。

upperVerticalAngle 可选

一个数字，表示球体的较高垂直角度（以弧度为单位）。默认值为 1.570795 (π/2)。

viewPixelHeight 必需

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

viewPixelWidth 必需

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

返回值

一个 XREquirectLayer 对象。

示例

创建 XREquirectLayer

使用上面列出的属性配置等距柱状图层，并在调用 createEquirect() 时传入。要将图层呈现给 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 equirectLayer = xrGlBinding.createEquirectLayer({
    space: xrReferenceSpace,
    viewPixelWidth: 1200,
    viewPixelHeight: 600,
    centralHorizontalAngle: 2 * Math.PI,
    upperVerticalAngle: Math.PI / 2.0,
    lowerVerticalAngle: -Math.PI / 2.0,
    radius: 0,
  });

  xrSession.updateRenderState({
    layers: [equirectLayer],
  });
}

规范

浏览器兼容性

另见

• XREquirectLayer
• WebGL 常量