XRView：transform 属性

一个 XRRigidTransform 对象，指定 XRView 所代表的视点的位置和方向。

对于构成呈现场景的每个视图，视图的 transform 代表观察者或相机相对于参考空间原点的位置和方向。然后，你可以使用该矩阵的逆矩阵来变换场景中的对象，以调整它们的位置和方向，模拟观察者在空间中的移动。

在这个例子中，我们看到渲染 XRFrame 时使用的代码片段的概要，它使用视图变换在渲染期间将对象放置在世界中。

const modelViewMatrix = mat4.create();
const normalMatrix = mat4.create();

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

  for (const obj of world.objects) {
    mat4.multiply(modelViewMatrix, view.transform.inverse.matrix, obj.matrix);
    mat4.invert(normalMatrix, modelViewMatrix);
    mat4.transpose(normalMatrix, normalMatrix);

    obj.render(modelViewMatrix, normalMatrix);
  }
}

两个矩阵是在渲染循环之外创建的；这避免了重复分配和释放矩阵，并且通常通过重复使用同一个矩阵来渲染每个对象来减少开销。

然后，我们遍历 XRViewerPose 的 views 列表中的每个 XRView。通常会有两个：一个用于左眼，一个用于右眼，但如果处于单眼模式，可能只有一个。目前，WebXR 不支持每个姿态超过两个视图，尽管在未来可以通过对 API 进行一些添加来扩展规范以支持这一点，但已经留出了扩展的空间。

对于每个视图，我们获取它的视口，并使用 gl.viewport() 将其传递给 WebGL。对于左眼，这将是画布的左侧，而右眼将使用右侧。

然后，我们遍历构成场景的每个对象。每个对象的模型视图矩阵是通过将描述对象自身位置和方向的矩阵乘以与相机移动匹配所需的额外位置和方向调整来计算的。为了将“以相机为中心的”变换矩阵转换为“以对象为中心的”变换，我们使用变换的逆矩阵，从而获取 view.transform.inverse.matrix 返回的矩阵。得到的模型视图矩阵将应用所有必要的变换，根据对象和相机的相对位置来移动和旋转对象。这将模拟相机的移动，即使实际上我们是在移动对象。

然后，我们通过反转模型视图矩阵，然后转置它来计算法线。

最后，我们调用对象的 render() 例程，传递 modelViewMatrix 和 normalMatrix，以便渲染器能够正确地放置和照亮对象。