rtsゲームで繰り返される大きなスペースの背景を作成するにはどうすればよいですか。複雑な星雲とほこりの場も持ちたいのですが、ユニットには探索するスペースがたくさんあるので、120000px x 1200000pxのjpegは持てないので、セグメント間の変更線は持たずに画像を繰り返したいです。
これをMicrosoftのBabylonフレームワークでWeb GLキャンバスに使用しています
rtsゲームで繰り返される大きなスペースの背景を作成するにはどうすればよいですか。複雑な星雲とほこりの場も持ちたいのですが、ユニットには探索するスペースがたくさんあるので、120000px x 1200000pxのjpegは持てないので、セグメント間の変更線は持たずに画像を繰り返したいです。
これをMicrosoftのBabylonフレームワークでWeb GLキャンバスに使用しています
回答:
視差スクロールを使用します。メインビューポイントの速度の異なる割合でスクロールする複数の背景レイヤーがあります。レイヤーが低いほど、スクロールが遅くなります。これは奥行きの錯覚を提供する素晴らしい方法ではありません。また、レイヤーが同期していないため、異なるレイヤー上のオブジェクトが異なるコンポジションで表示されるため、背景の繰り返しを少なくします。
背景を手続き的に作成します。1つの大きな背景グラフィックの代わりに、複数の異なる小さな要素を用意し、それらをすべてゲーム世界全体にランダムに複数回配置します。
ちなみに、JPEGを避けられる場合は使用しないでください。これは、変更して保存するたびに品質が低下する損失の多い形式であり、写真用に最適化されており、透明度をサポートしていません。PNGのようなアルファチャネルでロスレス形式を使用します。唯一の正当な理由は、ソース画像がJPEGでのみ利用可能で(NASAがすべてパブリックドメインにある多くの素敵な天文学の写真を公開した)、それらに一切変更を加えない場合です。
2Dゲームの無限の背景を構築する方法は次のとおりです。
お役に立てれば。
レイヤーはうまく機能します。
ここにいくつかの数学があります:
線路__ __
の隙間に気づくほどの粗末な鉄道線路があるとします。ホイールがそれらの上を転がると、小さなノッチ(小さなノッチ)ができます。
トラックの長さがある場合にはl
、車輪半径を持ってr
、その後2pi r
、車輪の円周であるration=l/(2pi r)
割合が、それは長い乗り物のようにホイールがそれに四半期ごとにノッチを取得します10.25を言っている場合。
これは、カバースペースを説明する最も簡単な方法です。
したがって、2つの画像があるとします。1つにこの4分の1の比率がある場合、4相のパターンが得られ、4タイル後に繰り返されます。1つのメイン背景と2つのオーバーレイがあり、mフェーズとnフェーズがあるとします。その後、m * nタイルの後にパターンが繰り返されます。
数値が互いに素である場合、パターンは最適に見えますが、最大公約数は1です。たとえば、フェーズ6のフェーズとフェーズ4のフェーズがあると仮定します。 " ある意味で。
この手法を(特にパーティクルやもので)使用すると、非常に少ない労力で多くの「ユニークな」ものを作成できます。
列車の車輪に戻って、比率が無理であれば、ノッチが車輪を覆います!しかし、これは実際には問題ではありません。
ここに欠けていると思われる別のアイデアがあります:
スカイボックスのような長距離背景の場合、Parallaxレイヤーはあまり気分が良くありません。たとえば、星を考えてみてください。地球上を歩いているとき、または夜通しでさえすれば、すべての星は一緒に動きますが、それらは互いに数百光年離れていることを知っています。問題は、距離が遠すぎて、私たちが距離に気付かないことです。それでも、非常に大きなテクスチャ(120k * 120kなど)を、限られた計算能力(最大で8k * 8kで処理できる)で描画したいということです。複数の視差レイヤーを使用するように、それぞれ異なる種類の詳細を持つ異なるテクスチャを作成する必要があります。たとえば、1つは銀河を表し、もう1つは星の束などを表します。しかし、今回は、異なる速度でそれらを移動するのではなく、サイズが異なるはずです。次に例を示します。3つのテクスチャの使用を検討してください。1つは2048 * 2048、もう1つは729 * 729、3つ目は625 * 625です。これらの数字は互いに素であるため、これらの3つのテクスチャを3つのレイヤーに組み合わせる場合、原点からlcm(2048,729,625)= 764Mピクセル移動して、同じものが描画されているのを見る必要があります。実際、他のレイヤーを追加したり、各テクスチャのサイズを変更したりすると、常に最大の結果が得られますテクスチャサイズの最小公倍数。
これは、手続き型ピクセルシェーダーの仕事のようです。
イメージを使用することの利点は次のとおりです。
単純なWeb検索により、このシェーダーがhttp://casual-effects.blogspot.com.au/2013/08/starfield-shader.htmlに表示されます。これは、探しているもののように見えます。
私はWebGLの専門家ではありませんが、このページによると、通常のGLSL言語を使用しているようです(これは、シェーダーをプログラムするためにグラフィックカードで使用されるC-Like言語です)。これは、おそらくそれを機能させるために行う変更がほとんどないかまったくないことを意味します。
ただし、どのように機能するかを理解するために、より基本的なシェーダーから始めようとするかもしれません。
このブログページには、WebGLでシェーダーを実装するためのすべての手順がリストされています。始めるのに良い場所のようです。
素晴らしいシェーダーの例を見つけるのに適した別の場所はhttps://www.shadertoy.com/です
大きなjpegを小さなセグメントに分割して配置(可視部分)することができ、常にメモリに保存する必要さえありません。
古いゲームのように、いくつかの「タイル」を繰り返すことができます。これはNESコンソールの一般的なソリューションであり、ハードウェアでもサポートされていました。