XRWebGLBinding: метод createQuadLayer()

Метод createQuadLayer() интерфейса XRWebGLBinding возвращает объект XRQuadLayer, представляющий собой слой, занимающий плоскую прямоугольную область в виртуальной среде.

options

Объект для настройки XRQuadLayer. Он должен содержать свойства 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:
• Все поддерживаемые форматы расширения. Значение по умолчанию — gl.RGBA.

depthFormat Необязательно

Значение GLenum, определяющее тип данных текстуры глубины, или 0 указывающее, что слой не должен предоставлять текстуру глубины (в этом случае XRProjectionLayer.ignoreDepthValues будет true). Возможные значения в контекстах WebGLRenderingContext с включённым расширением WEBGL_depth_texture, или в контекстах WebGL2RenderingContext (без расширения):

• gl.DEPTH_COMPONENT
• gl.DEPTH_STENCIL Дополнительно, для контекстов WebGL2RenderingContext:
• gl.DEPTH_COMPONENT24
• gl.DEPTH24_STENCIL24 Значение по умолчанию — gl.DEPTH_COMPONENT.

height Необязательно

Число, определяющее высоту слоя в метрах. Значение по умолчанию — 1.0.

isStatic Необязательно

Булево значение, которое, если истинно, указывает, что рисование на этом слое возможно только когда needsRedraw имеет значение true. Значение по умолчанию — false.

layout Необязательно

Строка, определяющая расположение слоя. Возможные значения:

default

Слой адаптируется ко всем представлениям сессии.

mono

Присваивается и отображается один XRSubImage для обоих глаз.

stereo

Агент пользователя определяет, как присваивается XRSubImage (один или два) и расположение (верх/низ или слева/справа).

stereo-left-right

Присваивается один XRSubImage. Левый глаз получает левую область текстуры, правый — правую.

stereo-top-bottom

Присваивается один XRSubImage. Левый глаз получает верхнюю область текстуры, правый — нижнюю. Значение по умолчанию — mono.

mipLevels Необязательно

Число, определяющее желаемое количество уровней mip. Значение по умолчанию — 1.

space Обязательно

Объект XRSpace, определяющий пространственные отношения слоя к физической среде пользователя.

textureType Необязательно

Строка, определяющая тип текстуры слоя. Возможные значения:

texture

Текстуры XRWebGLSubImage будут типа gl.TEXTURE_2D.

texture-array

Текстуры XRWebGLSubImage будут типа gl.TEXTURE_2D_ARRAY (только контексты WebGL 2). Значение по умолчанию — texture.

transform Необязательно

Объект XRRigidTransform, определяющий смещение и ориентацию относительно space.

viewPixelHeight Обязательно

Число, определяющее высоту слоя в пикселях.

viewPixelWidth Обязательно

Число, определяющее ширину слоя в пикселях.

width Необязательно

Число, определяющее ширину слоя в метрах. Значение по умолчанию — 1.0.

Объект XRQuadLayer.

Настройте слой с помощью перечисленных выше свойств в вызове createQuadLayer(). Чтобы представить слои устройству XR, добавьте их в состояние рендеринга layers с помощью XRSession.updateRenderState().

function onXRSessionStarted(xrSession) {
  const glCanvas = document.createElement("canvas");
  const gl = glCanvas.getContext("webgl2", { xrCompatible: true });
  const xrGlBinding = new XRWebGLBinding(xrSession, gl);
  const quadLayer = xrGlBinding.createQuadLayer({
    space: xrReferenceSpace,
    viewPixelHeight: 512,
    viewPixelWidth: 512,
    transform: new XRRigidTransform({ z: -2 }),
  });
  xrSession.updateRenderState({
    layers: [quadLayer],
  });
}

• XRQuadLayer
• Константы WebGL