2

私が取り組んでいるページには ajax-navigation があるため、ユーザーが WebGL を使用している部分から移動すると、RequestAnimationFrame ループを停止し、ユーザーがページに再度アクセスすると、すべての WebGL を再実行します。シーンを再現するコードをセットアップします。これは、通常のレンダラーを使用するとうまく機能しますが、EffectComposer では機能しません。

これがコードです。

初期化:

composerScene = new THREE.EffectComposer(renderer, new THREE.WebGLRenderTarget(width, height, { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat, stencilBuffer: true }));
renderModel = new THREE.RenderPass(scene, camera);
renderModel.renderToScreen = false;
renderModel.clear = true;
filmPass = new THREE.FilmPass(filmgrainOpacity, scanlineIntensity, scanlineCount, filmpassGrayscale);
filmPass.renderToScreen = true;

composerScene.addPass(renderModel);
composerScene.addPass(filmPass);

レンダリング：

composerScene.render(deltaTime);

ページから離れてから戻ると、エラー コンソールに次のように表示されます。

WebGL: INVALID_OPERATION: bindBuffer: object not from this context
GL_INVALID_OPERATION : glDrawXXX: attempt to access out of range vertices
WebGL: too many errors, no more errors will be reported to the console for this context.

また、レンダリングは行われません。コメントアウトするcomposerScene.addPass(filmPass);と、エラーは発生しなくなりました。

4

2 に答える 2

2

これは汚いハックですが、コンテキストを再初期化する直前にこれを行うと、EffectComposer が再び起動するのに役立ちます。

THREE.EffectComposer.camera = new THREE.OrthographicCamera( -1, 1, 1, -1, 0, 1 );
THREE.EffectComposer.quad = new THREE.Mesh( new THREE.PlaneGeometry( 2, 2 ), null );
THREE.EffectComposer.scene = new THREE.Scene();
THREE.EffectComposer.scene.add( THREE.EffectComposer.quad );

EffectComposer コードの下部を見ると、ロード時にこれが実行されていることがわかります。したがって、実行しているのは、それらを初期状態に戻すことだけです。コードでこれを試してみたところ、WebGL コンテキストを再初期化し、大量のエラーをスローすることなく EffectComposer を再度使用することができました。

于 2013-01-28T18:15:57.010 に答える
1

Three.js のバグだと思います。Issue をオープンしました。

于 2013-01-20T11:40:11.860 に答える