rendering - Three.js - Deferred Rendering を使用してエリアライトに影を追加する

Question

シンプルなシーンに WebGLDeferredRenderer を使用しています (部屋をシミュレートする立方体と影をテストするための 2 つの小さな立方体で作成) が、シーンで使用されている areaLight から生成された影を表示できません!

このデモには 3 つのエリアライトがありますが、いずれも 1 つのオブジェクトに影を生成しません (「部屋」を照らすだけです)。

この問題を解決するために使用できる特定のシェーダーはありますか? それとも...遅延レンダリングで影を落とす可能性はありますか? :)

score 3 · Accepted Answer

シャドウは現在、。を使用した遅延レンダリングを使用するthree.jsr.56ではサポートされていませんWebGLDeferredRenderer。

これは、three.jsで遅延レンダリングを使用してポイントライトとスポットライトが影を落とす2つの例ですが、ライブラリの変更バージョンを使用しています。

ただし、エリアライトの例はまだありません。

したがって、必要なのは実行可能であり、まだサポートされておらず、エリアライトではありません。

three.js r.56

score 0 · Accepted Answer

エリアの大きさに基づいて、シャドウマッピングソースをプッシュバックする必要があると思います...シャドウキャスターをプッシュする必要がある距離に応じて、パーセンテージクローズフィルタリングを使用して眼球を混乱させることもできます。

score 0 · Accepted Answer

エリアライトシャドウはまだ実装されていないと思いますが、おそらく誰かが取り組んでいるので、将来的には可能になるかもしれません。自分でやろうとすることもできますが、それには深刻なプログラミングスキルが必要です。解決するのは簡単な問題ではありません:)

現在、ディファードレンダラーでスポットライトシャドウとディレクショナルライトシャドウを使用できると思います。おそらく、ポイントライトシャドウも使用できます。

影だけに低強度の別のライトタイプを使用して影を偽造することもできますが、それは少し不安定に見えるかもしれません。

score 0 · Accepted Answer

ディレクショナルライトまたはポイントライトを使用します。エリアライトは影を落としません。

rendering - Three.js - Deferred Rendering を使用してエリア ライトに影を追加する