XRSession: phương thức updateRenderState()
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
Phương thức updateRenderState() của giao diện XRSession trong WebXR API lên lịch các thay đổi được áp dụng cho trạng thái kết xuất đang hoạt động (XRRenderState) trước khi kết xuất khung hình tiếp theo.
Cú pháp
updateRenderState()
updateRenderState(state)
Tham số
stateOptional-
Một đối tượng tùy chọn để cấu hình
XRRenderState. Nếu không cung cấp, cấu hình mặc định sẽ được sử dụng.baseLayerOptional: Một đối tượngXRWebGLLayermà bộ tổng hợp WebXR sẽ lấy hình ảnh từ đó. Mặc định lànull. Để chỉ định các lớp khác (hoặc nhiều lớp), xem tùy chọnlayers.depthFarOptional: Một giá trị dấu phẩy động chỉ định khoảng cách tính bằng mét từ người xem đến mặt phẳng cắt xa, là một mặt phẳng song song với bề mặt hiển thị mà ngoài ra không có kết xuất nào khác sẽ xảy ra. Tất cả kết xuất sẽ diễn ra giữa các khoảng cách được chỉ định bởidepthNearvàdepthFar. Mặc định là 1000 mét (1 kilômét).depthNearOptional: Một giá trị dấu phẩy động cho biết khoảng cách tính bằng mét từ người xem đến một mặt phẳng song song với bề mặt hiển thị làm mặt phẳng cắt gần. Không có phần nào của cảnh ở phía người dùng của mặt phẳng này sẽ được kết xuất. Mặc định là 0.1 mét (10 xentimét).inlineVerticalFieldOfViewOptional: Một giá trị dấu phẩy động cho biết trường nhìn mặc định, tính bằng radian, để sử dụng khi tính toán ma trận chiếu cho mộtXRSessioninline. Tính toán ma trận chiếu cũng tính đến aspect ratio của canvas đầu ra. Thuộc tính này không được chỉ định cho các phiên nhập vai, do đó, giá trị lànullmặc định cho các phiên nhập vai. Giá trị mặc định là π * 0.5 (một nửa giá trị của pi).layersOptional: Một mảng có thứ tự của các đối tượngXRLayerchỉ định các lớp sẽ được trình bày cho thiết bị XR. Đặtlayerssẽ ghi đèbaseLayernếu có, vớibaseLayerbáo cáonull. Thứ tự của các lớp đã cho là "sau-trước". Để biết về hòa trộn alpha của các lớp, xem thuộc tínhXRCompositionLayer.blendTextureSourceAlpha.
Giá trị trả về
Không có (undefined).
Ngoại lệ
InvalidStateErrorDOMException-
Được ném trong bất kỳ tình huống nào sau đây:
XRSessionđã kết thúc, vì vậy bạn không thể thay đổi trạng thái kết xuất của nó.baseLayerđược tạo bởi mộtXRSessionkhác với phiên màupdateRenderState()được gọi.- Tùy chọn
inlineVerticalFieldOfViewđược đặt, nhưng phiên là nhập vai và do đó không cho phép sử dụng thuộc tính này.
NotSupportedErrorDOMException-
Được ném trong bất kỳ tình huống nào sau đây:
- Tùy chọn
layersđược sử dụng trong một phiên đã được tạo mà không có tính nănglayers. - Cả hai tùy chọn
baseLayervàlayersđều được chỉ định.
- Tùy chọn
TypeError-
Được ném nếu tùy chọn
layerschứa các bản sao trùng lặp.
Ví dụ
>Thêm một baseLayer
Ví dụ này tạo một ngữ cảnh WebGL tương thích với thiết bị XR nhập vai và sau đó sử dụng nó để tạo một XRWebGLLayer. Phương thức updateRenderState() sau đó được gọi để liên kết XRWebGLLayer mới.
function onXRSessionStarted(xrSession) {
let glCanvas = document.createElement("canvas");
let gl = glCanvas.getContext("webgl", { xrCompatible: true });
loadWebGLResources();
xrSession.updateRenderState({
baseLayer: new XRWebGLLayer(xrSession, gl),
});
}
Đặt mảng layers
Để sử dụng các lớp WebXR, phiên XR cần được tạo với bộ mô tả tính năng layers (xem XRSystem.requestSession()). Sau đó, bạn có thể tạo các lớp WebXR khác nhau như
Các lớp khác, chẳng hạn như XRProjectionLayer hoặc XRWebGLLayer cũng có sẵn.
Các lớp sẽ được trình bày theo thứ tự chúng được cung cấp trong mảng layers, với các lớp được cung cấp theo thứ tự "sau-trước".
const xrSession = navigator.xr.requestSession("immersive-ar", {
optionalFeatures: ["layers"],
});
function onXRSessionStarted(xrSession) {
const glCanvas = document.createElement("canvas");
const gl = glCanvas.getContext("webgl", { xrCompatible: true });
const xrGlBinding = new XRWebGLBinding(xrSession, gl);
const projectionLayer = new XRWebGLLayer(xrSession, gl);
const quadLayer = xrGlBinding.createQuadLayer({
pixelWidth: 1024,
pixelHeight: 1024,
});
xrSession.updateRenderState({
layers: [projectionLayer, quadLayer],
});
}
Thông số kỹ thuật
| Specification |
|---|
| WebXR Device API> # dom-xrsession-updaterenderstate> |