Tiện ích mở rộng OVR_multiview2
Khả dụng hạn chế
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Tiện ích mở rộng OVR_multiview2 là một phần của WebGL API và thêm hỗ trợ kết xuất đồng thời vào nhiều view. Điều này đặc biệt hữu ích cho thực tế ảo (VR) và WebXR.
Để biết thêm thông tin, xem:
- Multiview on WebXR
- Multiview in babylon.js
- Optimizing Virtual Reality: Understanding Multiview
- Multiview WebGL Rendering for Meta Quest
Các tiện ích mở rộng WebGL có sẵn thông qua phương thức WebGLRenderingContext.getExtension(). Để biết thêm thông tin, xem Sử dụng tiện ích mở rộng trong hướng dẫn WebGL.
Note: Hỗ trợ phụ thuộc vào trình điều khiển đồ họa của hệ thống (Windows+ANGLE và Android được hỗ trợ; Windows+GL, Mac, Linux không được hỗ trợ).
Tiện ích mở rộng này chỉ có sẵn cho các ngữ cảnh WebGL 2 vì nó cần GLSL 3.00 và mảng texture.
Hiện tại, không có cách nào sử dụng multiview để kết xuất vào backbuffer đa mẫu, vì vậy bạn nên tạo ngữ cảnh với antialias: false. Tuy nhiên, trình duyệt Oculus (6+) cũng hỗ trợ đa mẫu bằng tiện ích mở rộng OCULUS_multiview.
Hằng số
Tiện ích mở rộng này cung cấp 4 hằng số có thể được sử dụng trong getParameter() hoặc getFramebufferAttachmentParameter().
FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR-
Số lượng view của attachment đối tượng framebuffer.
FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR-
Chỉ số view cơ sở của attachment đối tượng framebuffer.
MAX_VIEWS_OVR-
Số lượng view tối đa. Hầu hết tai nghe VR có hai view, nhưng có các nguyên mẫu tai nghe với FOV siêu rộng sử dụng 4 view là số lượng view tối đa được hỗ trợ bởi multiview.
FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR-
Nếu baseViewIndex không giống nhau cho tất cả các điểm gắn kết framebuffer khi giá trị
FRAMEBUFFER_ATTACHMENT_OBJECT_TYPEkhông phảiNONE, framebuffer được coi là không hoàn chỉnh.
Phương thức phiên bản
framebufferTextureMultiviewOVR()-
Kết xuất đồng thời vào nhiều phần tử của mảng texture 2D.
Ví dụ
Ví dụ này được lấy từ thông số kỹ thuật.
const gl = document
.createElement("canvas")
.getContext("webgl2", { antialias: false });
const ext = gl.getExtension("OVR_multiview2");
const fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, fb);
const colorTex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D_ARRAY, colorTex);
gl.texStorage3D(gl.TEXTURE_2D_ARRAY, 1, gl.RGBA8, 512, 512, 2);
ext.framebufferTextureMultiviewOVR(
gl.DRAW_FRAMEBUFFER,
gl.COLOR_ATTACHMENT0,
colorTex,
0,
0,
2,
);
const depthStencilTex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D_ARRAY, depthStencilTex);
gl.texStorage3D(gl.TEXTURE_2D_ARRAY, 1, gl.DEPTH32F_STENCIL8, 512, 512, 2);
ext.framebufferTextureMultiviewOVR(
gl.DRAW_FRAMEBUFFER,
gl.DEPTH_STENCIL_ATTACHMENT,
depthStencilTex,
0,
0,
2,
);
gl.drawElements(/* … */); // draw will be broadcasted to the layers of colorTex and depthStencilTex.
Mã shader
#version 300 es
#extension GL_OVR_multiview2 : require
precision mediump float;
layout (num_views = 2) in;
in vec4 inPos;
uniform mat4 u_viewMatrices[2];
void main() {
gl_Position = u_viewMatrices[gl_ViewID_OVR] * inPos;
}
Ngoài ra, xem bản demo three.js để có ví dụ multiview trực tiếp.
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| WebGL OVR_multiview2 Extension Specification |