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 常量