Three.js: シャドウマップ-透明な平面に影を落とす

作成日 2012年04月23日  ·  28コメント  ·  ソース: mrdoob/three.js

こんにちは、

平面に適用されたマテリアルではなく、シャドウのみを表示するために、透明な平面にシャドウをキャストする必要があります(完全に透明にしたい)。 これはthree.jsで可能ですか? 光源としてTHREE.SpotLightを使用しています。

回避策として、完全に透明なテクスチャマップをマテリアルとして適用し、期待どおりに機能するかどうかを確認できると思いますが、標準のマテリアルプロパティを調整するだけで、この効果を得ることができるかどうか疑問に思いました。

ありがとう

Question

最も参考になるコメント

r77時点で、 ShadowMaterialがコアになりました。

全てのコメント28件

透明なテクスチャマッピングされた平面に影を落とすことができないため、回避策は機能しませんでした...

それは不可能だと思います。

質問を理解できるかどうかはわかりませんが、透明な素材に影を落とす必要があります。

うまくいかないのは、透明な素材を通して輝く光です。 つまり、マテリアルの透明度に関係なく、すべてが完全に不透明または完全に透明で、間にはありません。

#1509の説明も参照してください

うまくいかないのは、透明な素材を通して輝く光です。 つまり、マテリアルの透明度に関係なく、すべてが完全に不透明または完全に透明で、間にはありません。

ええ、それが彼の意味だと思います。

参考までに、誰かがそれを必要とするならばhttp://pastie.org/5088640

@skratそのシェーダーをありがとう。 シャドウキャッチャーに最適!

@etxええと、そのシェーダーは何をしますか? :U

アルファ付きのシャドウが表示され、そのシェーダーを持つオブジェクトの残りの部分は表示されません。 これは、CGIソフトウェアのシャドウキャッチャーに似ています。 写真の上に製品をレンダリングするためにthreejsを使用しているので、これは非常に便利です。

そうそう。 そのため、アルファチャネルに保存された可視性を備えた黒いテクスチャが得られます。 正しい?

うん!

@etx上記のシェーダーを使用してこれをどのように達成できますか? 私が得るのはただの黒い飛行機です......

彼の効果を得る方法を探していましたが、上記のスニペットを使用すると、 THREE.WebGLShader: Shader couldn't compile.エラーが発生します。

@skratそのシェーダーを再アップロードできる可能性はありますか? パスティリンクが機能しなくなり、まったく同じ問題が発生しました。よろしくお願いします。

@etx @skrat更新されたシェーダーを再アップロードしていただけませんか? @JosephClayのように、投稿したものはもう機能していないようです。「シェーダーをコンパイルできませんでした」というエラーが表示されます...

THREE.ShadowMaterial()試しください。 このstackoverflowの投稿を参照してください。

@WestLangley ShadowMaterialをコアに昇格させるべきだと思いますか?

@WestLangleyはどうもありがとう-それはそれを解決しました。 @mrdoobこれはGCIから多くの人が知っている非常に便利な機能だと思うので、コアの良いプロモーションになるかもしれません

@WestLangley ShadowMaterialをコアに昇格させる必要があると思いますか?

私はどちらの方向にも強い感情を持っていません...私が間違っていなければ、それはMeshLambertMaterialと同じ欠陥に苦しんでいます-ある光の影にあるテクセルは他の光から光を受け取りません。

ええ、それはマスクです。 基本的に、古い影はどのようになっていたか。

こんにちは、

ShadowMaterialはまさに私が必要としているもののように聞こえ、あなたがそれを実装してくれてとてもうれしいです-しかし、それを機能させるためにダウンロード/リンクする必要があるthree.jsのバージョンを理解することはできません。 私を正しい方向に向けてもらえますか?

r74以降

ありがとうございました! 私はまだTHREEを取得します。ShadowMaterialはコンストラクターではありません。

ビルドにはまだ含まれていません。examplesフォルダーにあります。 個別に含める必要があります。

<script src="js/materials/ShadowMaterial.js"></script>

コアにも昇格します、それは4kbです

パーフェクト、ありがとう! 以前にshadowMaterialファイルを探しましたが、見つかりませんでした。
私のニーズにぴったりです。

r77時点で、 ShadowMaterialがコアになりました。

@mrdoob素晴らしい動きありがとう

THREE.ShadowMaterial()試しください。 このstackoverflowの投稿を参照してください。

ありがとう。
できます!

このページは役に立ちましたか?
0 / 5 - 0 評価