XRMediaBinding: createEquirectLayer() 方法

可用性有限

此特性不是基线特性,因为它在一些最广泛使用的浏览器中不起作用。

实验性: 这是一项实验性技术
在生产中使用此技术之前,请仔细检查浏览器兼容性表格

XRMediaBinding 接口的 createEquirectLayer() 方法返回一个 XREquirectLayer 对象,该对象是一个将等距柱状编码数据映射到球体内部的图层。

语法

js
createEquirectLayer(video, options)

参数

video

要显示的 HTMLVideoElement

options

用于配置 XREquirectLayer 的对象。该对象可以具有以下属性,并且 space 是必需的。

centralHorizontalAngle 可选

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

invertStereo 可选

一个布尔值,指定视频中每个视图的自然位置是否应被反转。默认为 false

layout 可选

一个字符串,指示视频的布局。可能的值:

default

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

mono

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

stereo

用户代理决定如何分配 XRSubImage(一个或两个)和布局(顶部/底部或左/右)。建议为 stereo 布局使用 texture-array 纹理类型。

stereo-left-right

分配单个 XRSubImage。左眼获取纹理的左侧区域,右眼获取右侧区域。此布局旨在最大限度地减少对已为立体声(例如立体声视频或图像)的内容的绘图调用。

stereo-top-bottom

分配单个 XRSubImage。左眼获取纹理的顶部区域,右眼获取底部区域。此布局旨在最大限度地减少对已为立体声(例如立体声视频或图像)的内容的绘图调用。默认值为 mono

lowerVerticalAngle 可选

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

radius 可选

一个数字,表示球体的半径。默认值 0.0

space 必需

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

transform 可选

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

upperVerticalAngle 可选

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

返回值

一个 XREquirectLayer 对象。

示例

创建一个 XREquirectLayer 来显示视频

创建一个 XRMediaBinding 并使用传递给 createEquirectLayer()HTMLVideoElement。使用上面列出的选项配置四边形图层,并通过将其添加到 XRSession.updateRenderState()layers 渲染状态中,将图层呈现给 XR 设备。

js
function onXRSessionStarted(xrSession) {
  const xrMediaBinding = new XRMediaBinding(xrSession);
  const video = document.createElement("video");
  video.src = "just-fascination.mp4";

  const videoLayer = xrMediaBinding.createEquirectLayer(video, {
    space: xrReferenceSpace,
  });

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

规范

规范
WebXR Layers API Level 1
# dom-xrmediabinding-createequirectlayer

浏览器兼容性

另见