XRMediaBinding: createEquirectLayer() 方法
XRMediaBinding 接口的 createEquirectLayer() 方法返回一个 XREquirectLayer 对象,该对象是一个将等距柱状编码数据映射到球体内部的图层。
语法
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 设备。
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 |
浏览器兼容性
加载中…