1

Three.jsを使った継続的な実験で、乗り越えられないような別の壁にぶつかりました。

SSAO後処理効果のある前景シーンの下に、背景シーン（床が含まれている）をレンダリングしようとしています。背景シーンには後処理を適用しないでください。

私は（マスクなどを使用して）複数のアプローチを試しましたが、これをクラックすることはできません。私が見ている主な問題は、SSAOシーンの背景が不透明であるため、背景シーンが表示されていないことです。その透明性の問題が解決されたとしても、物事が期待どおりに機能することを私はまだ確信していません。

SSAOこれは、後処理なしで物事がどのように見えるべきかです：http: //jsfiddle.net/uJbPe/1/

そして、これは、SSAO後処理を有効にした状態で現在どのように見えるかです：http：//jsfiddle.net/7hfdC/6/

私が間違っていることについて何か考えはありますか？

4

2 に答える 2

2

マスキングパスを使用して、これを実現できます。それが問題に取り組む正しい方法だと思います。これを可能にするには、元のコードにいくつかの追加が必要になります。

まず、使用するエフェクトコンポーザーに渡すことができるステンシルバッファーが有効になっているレンダーターゲットを作成する必要があります。ステンシルバッファ内の情報により、マスキングを実行できます。

renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat, stencilBuffer: true };
renderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, renderTargetParameters );
composer = new THREE.EffectComposer( renderer, renderTarget );

次に、バックグラウンドパスとフォアグラウンドパスの両方をコンポーザーに含めることをお勧めします。レンダリングスタックがよりクリーンになります。フォアグラウンドシーンをレンダリングするときは、そのclearプロパティがfalseに設定されていることを確認して、ステンシルバッファデータがマスキングパス用に保持されるようにします。

次に、マスクパス、ssaoパス、クリアマスクパス、および最後のシェーダーパスを使用して、すべてを画面にレンダリングします。ここでは、単純なパススルーシェーダーまたはfxaaを使用できます。私が知らない別の方法で画面にレンダリングすることもできますが、ssaoパスを割り当てて画面にレンダリングし、クリアマスクパスがそれに続くときに機能させることはできません。

このアプローチが実装されたフィドルへのリンクは次のとおりですhttp://jsfiddle.net/xqLdz/3/

于 2013-03-13T16:33:23.243 に答える
0

私は非常によく似た何かをしています。SSAOで、「ssaoPass.material.transparent=true;」を試しましたか。デフォルトのRGBではなくフォアグラウンドRGBAを作成すると、問題を解決できるようです。

于 2013-03-09T03:32:04.033 に答える