XRWebGLBinding: getSubImage() 方法
XRWebGLBinding 接口的 getSubImage() 方法返回一个 XRWebGLSubImage 对象,该对象表示要渲染的 WebGL 纹理。
语法
js
getSubImage(layer, frame)
getSubImage(layer, frame, eye)
参数
layer-
用于渲染的
XRCompositionLayer(可以是除XRProjectionLayer之外的所有类型的XRCompositionLayer对象,有关渲染投影层的请参阅XRWebGLBinding.getViewSubImage())。 frame-
用于渲染的
XRFrame帧。 eye可选-
一个可选的
XRView.eye,指示要用于渲染的视图的哪只眼睛。可能的值
返回值
一个 XRWebGLSubImage 对象。
异常
如果满足以下任一条件,则会抛出 TypeError:
- 如果
layer不在 会话的layer数组中。 - 如果
layer是一个XRProjectionLayer。 - 如果图层的
layout属性是default。 - 如果图层的
layout属性是stereo且eye是none。
示例
渲染 XRQuadLayer
以下示例渲染了一个 XRQuadLayer。
js
const xrGlBinding = new XRWebGLBinding(xrSession, gl);
const quadLayer = xrGlBinding.createQuadLayer({
space: xrReferenceSpace,
viewPixelWidth: 512,
viewPixelHeight: 512,
});
// Position 2 meters away from the origin with a width and height of 1.5 meters
quadLayer.transform = new XRRigidTransform({ z: -2 });
quadLayer.width = 1.5;
quadLayer.height = 1.5;
const framebuffer = gl.createFramebuffer();
xrSession.updateRenderState({ layers: [quadLayer] });
xrSession.requestAnimationFrame(onXRFrame);
function onXRFrame(time, xrFrame) {
xrSession.requestAnimationFrame(onXRFrame);
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
let subImage = xrGlBinding.getSubImage(quadLayer, xrFrame);
gl.framebufferTexture2D(
gl.FRAMEBUFFER,
gl.COLOR_ATTACHMENT0,
subImage.colorTexture,
0,
);
let viewport = subImage.viewport;
gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height);
// Render content for the quad layer
}
规范
| 规范 |
|---|
| WebXR Layers API Level 1 # dom-xrwebglbinding-getsubimage |
浏览器兼容性
加载中…