XRWebGLLayer: метод getViewport()

Метод getViewport() интерфейса XRWebGLLayer возвращает XRViewport, который следует использовать для рендеринга указанного XRView в слой WebGL. Для устройств WebXR, использующих один буфер кадра для левого и правого глаза, возвращаемый viewport представляет область буфера кадра, в которую должна быть отрисована сцена для глаза, представленного вью.

view

Объект XRView, указывающий представление, для которого должен быть возвращен viewport.

Объект XRViewport, представляющий viewport, который ограничит отрисовку областью слоя, соответствующей указанному view.

InvalidStateError DOMException

Выбрасывается, если указанное view не находится в активном XRFrame или если XRFrame и XRWebGLLayer не являются частью одной и той же сессии WebXR.

В этом примере показано, как может выглядеть обработчик функции requestAnimationFrame(), использующий getViewport() для получения viewport, чтобы ограничить отрисовку областью, отведенной для глаза, чья точка зрения в настоящее время рендерится.

Это работает, потому что набор представлений, возвращаемый XRViewerPose, каждый представляет перспективу одного глаза на сцене. Поскольку буфер кадра разделен пополам, по одной половине для каждого глаза, установка viewport WebGL в соответствии с viewport слоя WebXR гарантирует, что при рендеринге сцены для текущей позы глаза она будет отрисована в правильной половине буфера кадра.

function drawFrame(time, frame) {
  const session = frame.session;

  const pose = frame.getViewerPose(mainReferenceSpace);

  if (pose) {
    const glLayer = session.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_COLOR_BIT);

    for (const view of pose.views) {
      const viewport = glLayer.getViewport(view);
      gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height);

      /* Render the scene now */
    }
  }
}

• API устройств WebXR