ホームページ > ウェブフロントエンド > jsチュートリアル > Three.js で惑星の周囲の大気をレンダリングするにはどうすればよいですか?

Three.js で惑星の周囲の大気をレンダリングするにはどうすればよいですか?

DDD
リリース: 2024-11-12 07:30:02
オリジナル
220 人が閲覧しました

How can I render an atmosphere around a planet in Three.js?

Three.js で地球のレンダリングの上に「大気」をレンダリングするにはどうすればよいですか?

問題

をもらおうとしていますThree.js のテクスチャリングを生き生きとさせます。私が遭遇した問題は、ブラウザーがテクスチャの読み込みを妨げていたことであり、この問題はここの手順に従うことで修正されました。

さらに、私は宇宙船を含むクラスの 1 つ用にスペース ナビゲーター ゲームを構築しています。ナビゲーション。その結果、地球もその 1 つとして、惑星のグループをレンダリングしています。以下に私の地球のレンダリング画像を含めました。状態は良いように見えますが、周囲に「雰囲気」を追加することでリアリティを向上させようとしています。

周りを見回して、グローを使用した非常に見栄えの良い作品をいくつか発見しましたが、これらが私の状況に当てはまるとは思えません。

そして、これが私のシーンに地球を配置するコードです (Three.js から取得したコードの修正バージョンです)チュートリアル):

Three.js で惑星の周囲の大気をレンダリングするにはどうすればよいですか?

> ;

解決策

[編集3]

これは、上記のシェーダーを使用して雰囲気をレンダリングするためにエンジンで使用するコンパクトな CPU 側のコード例です。

私のエンジンから取り出したものなので、あなたが持っていないさまざまなものが使用されていますが、物事がどのように使用されるかについてのアイデアが得られるはずです。たとえば、g2l_dir は位置ではなくベクトルを変換し、l2g はベクトルではなく位置を変換します。 fromscr は画面座標を 3D 座標 (カメラに対してローカル) に変換し、vector_one はベクトルを単位ベクトルに正規化します。

追加情報

  • [サイズと質量に関して現実的な n 体太陽系シミュレーションを作成することは可能ですか? ](https://forum.threejs.org/viewtopic.php?t=14122)

大気の例レンダリング

大気散乱と GLSL の印象的な例をいくつか示します。

  • [リアルタイム 3D のための大気散乱を解明する]グラフィックス](https://marcinignac.com/2014/04/03/demystifying-atmospheric-scattering/)
  • [大気光散乱 (部分) 1)](https://www.clicktorelease.com/blog/atmospheric-light-scattering-part-1)
  • [Javidx9/raymarching_

以上がThree.js で惑星の周囲の大気をレンダリングするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート