Question

我在清理WebGl-Scenes时遇到了问题。我正在使用带有WebGlRenderer的Three.js。在我的应用程序中，我必须经常更改视图，因此需要始终渲染新场景。现在，我摧毁并重新初始化整个Threejs场景。切换场景大约15 - 20次后，我收到以下警告：

WARNING: Too many active WebGL contexts. Oldest context will be lost.

切换几次后，上下文完全丢失，应用程序崩溃。

清理时有没有办法销毁当前的WebGl上下文？或者，WebGlRenderer在实例化时是否始终创建新的WebGl上下文？

我正在使用Three.js R64。

Answer 1

我遇到了同样的问题，但由于要求，我无法使用SPA解决问题。

在这种情况下，WebGLRenderer中有.forceContextLoss（）方法（第71版，也许是早期）。

所以，我在'deallocate'方法中的代码就像

一样

_self.renderer.forceContextLoss();
_self.renderer.context = null;
_self.renderer.domElement = null;
_self.renderer = null;

Answer 2

您可以为不同的场景保留相同的渲染器。渲染器不关心渲染的场景。如果您愿意，每次拨打Scene时，您都可以提供不同的render()。

// instantiate only once and keep it
var renderer = new THREE.WebGLRenderer();

// current scene and camera. Switch whenever you like
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(...);
fillScene(scene);

// rendering always uses current scene
function render() {
    renderer.render(scene, camera);
    requestAnimationFrame(render);
}

/* ... 
 *   somewhere in your application
 * ...
 */
if(condition) {
  // switch scene
  scene = new THREE.Scene();
  fillOtherScene(scene);
}

Answer 3

您应该只创建和使用一个WebGlRenderer。在我的SPA（单页面应用程序）中，在几次重定向后，我在THREE.js中遇到了相机/场景的奇怪问题。这是因为每次呈现一个特定页面时都会创建WebGlRenderer。控制台日志中没有错误（只有你写的警告）。 Bug出现了相机位置的变化和渲染问题。

清理Threejs WebGl上下文

3 个答案: