VRDisplay：cancelAnimationFrame() 方法
已弃用：此特性不再推荐。虽然某些浏览器可能仍然支持它，但它可能已经从相关的网络标准中删除，可能正在删除过程中，或者可能仅为兼容性目的而保留。请避免使用它，如果可能，请更新现有代码；请参阅本页底部的兼容性表格以指导您的决策。请注意，此特性可能随时停止工作。
非标准：此特性未标准化。我们不建议在生产环境中使用非标准特性，因为它们浏览器支持有限，并且可能会更改或被移除。但是，在没有标准选项的特定情况下，它们可以是合适的替代方案。
cancelAnimationFrame() 方法是 VRDisplay 接口的一个特殊实现，它是 Window.cancelAnimationFrame 的一个特殊版本，用于取消使用 VRDisplay.requestAnimationFrame() 注册的回调函数。
注意：此方法是旧版 WebVR API 的一部分。它已被 WebXR Device API 取代。
语法
js
cancelAnimationFrame(handle)
参数
handle-
你想取消注册的
VRDisplay.requestAnimationFrame()调用返回的句柄。
返回值
无（undefined）。
示例
js
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
drawScene();
// WebVR: Check to see if WebVR is supported
if (navigator.getVRDisplays) {
console.log("WebVR 1.1 supported");
// Then get the displays attached to the computer
navigator.getVRDisplays().then((displays) => {
// If a display is available, use it to present the scene
if (displays.length > 0) {
vrDisplay = displays[0];
console.log("Display found");
// Starting the presentation when the button is clicked: It can only be called in response to a user gesture
btn.addEventListener("click", () => {
if (btn.textContent === "Start VR display") {
vrDisplay.requestPresent([{ source: canvas }]).then(() => {
console.log("Presenting to WebVR display");
// Set the canvas size to the size of the vrDisplay viewport
const leftEye = vrDisplay.getEyeParameters("left");
const rightEye = vrDisplay.getEyeParameters("right");
canvas.width =
Math.max(leftEye.renderWidth, rightEye.renderWidth) * 2;
canvas.height = Math.max(
leftEye.renderHeight,
rightEye.renderHeight,
);
// stop the normal presentation, and start the vr presentation
window.cancelAnimationFrame(normalSceneFrame);
drawVRScene();
btn.textContent = "Exit VR display";
});
} else {
vrDisplay.exitPresent();
console.log("Stopped presenting to WebVR display");
btn.textContent = "Start VR display";
// Stop the VR presentation, and start the normal presentation
vrDisplay.cancelAnimationFrame(vrSceneFrame);
drawScene();
}
});
}
});
} else {
info.textContent = "WebVR API not supported by this browser.";
}
function drawVRScene() {
// WebVR: Request the next frame of the animation
vrSceneFrame = vrDisplay.requestAnimationFrame(drawVRScene);
// …
}
注意：您可以在 raw-webgl-example 中查看此完整代码。
规范
此方法是旧版 WebVR API 的一部分，已被 WebXR Device API 取代。它不再是标准化的方向。
在所有浏览器都实现新的 WebXR API 之前，建议依靠 A-Frame、Babylon.js 或 Three.js 等框架，或 polyfill 来开发可在所有浏览器上运行的 WebXR 应用程序。有关更多信息，请阅读 Meta 的从 WebVR 移植到 WebXR 指南。
浏览器兼容性
加载中…