XRView:eye 属性

实验性:这是一个实验性技术
在生产环境中使用之前,请仔细查看浏览器兼容性表

安全上下文:此功能仅在安全上下文(HTTPS)中可用,在一些或所有支持的浏览器中可用。

XRView 接口的只读 eye 属性是一个字符串,表示 XRView 所代表的哪只眼睛的视点:leftright。对于不代表任何眼睛的视图,例如单眼视图,此属性的值为 none

一个可以是以下值之一的字符串

left

XRView 代表观察者左眼的视角。

该视图代表观察者的右眼。

none

XRView 描述了一个单眼视图,或者该视图不代表特定眼睛的视角。

使用说明

此属性的主要目的是允许将任何预渲染立体内容的正确区域呈现给正确的眼睛。对于动态渲染的 3D 内容,您通常可以忽略这一点,并一个接一个地渲染观察者的每个视图。

示例

以下代码来自观察者姿势的渲染器,它遍历姿势的视图并渲染它们。但是,我们有一些标志,如果为 true,则表示在游戏过程中特定眼睛受伤。渲染该眼睛时,如果标志为 true,则跳过该视图,而不是渲染它。

js
glLayer = xrSession.renderState.baseLayer;
gl.bindFramebuffer(gl.FRAMEBUFFER, glLayer.framebuffer);
gl.clearColor(0, 0, 0, 1.0);
gl.clearDepth(1.0);
gl.clear(gl.COLOR_BUFFER_BIT, gl.DEPTH_BUFFER_BIT);

for (const view of xrPose.views) {
  let skipView = false;

  if (view.eye === "left" && body.leftEye.injured) {
    skipView = updateInjury(body.leftEye);
  } else if (view.eye === "right" && body.rightEye.injured) {
    skipView = updateInjury(body.rightEye);
  }

  if (!skipView) {
    let viewport = glLayer.getViewport(view);
    gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height);
    renderScene(gl, view);
  }
}

对于每个视图,都会检查 eye 的值,如果它是 leftright,我们检查 body.leftEye.injuredbody.rightEye.injured 属性是否为 true;如果是,我们在该眼睛上调用函数 updateInjury(),以便根据游戏需求进行一些操作,例如允许一些愈合发生,跟踪毒素效果的进展等。

updateInjury() 如果眼睛仍然受伤,则返回 true,如果眼睛已被函数恢复健康,则返回 false。如果结果为 false,表示眼睛现在已恢复健康,我们将为该眼睛渲染场景。否则,我们不会渲染。

规范

规范
WebXR 设备 API
# dom-xrview-eye

浏览器兼容性

BCD 表仅在浏览器中加载