アウトライングロー効果のエイリアシングを減らすにはどうすればよいですか?


42

Left 4 Deadゲームで輝くアウトライン効果を再現しようとしています。この効果により、オブジェクトが隠されている場合でも、オブジェクトの輪郭が輝きます。効果のスクリーンショットは次のとおりです。

ここに画像の説明を入力してください

OpenGLベースのプログラムでこの効果をある程度再現できます。これは私が現在やっていることです:

  • 輝くオブジェクトをレンダリングするための画面サイズの半分の色と深さのテクスチャを作成します
  • グローカラー/深度テクスチャをクリアします。色は黒にクリアされます。
  • 輝くオブジェクトごとに、単色としてグローテクスチャにレンダリングします。
  • グローテクスチャで分離可能なガウスぼかしを実行する
  • 通常どおりフル解像度のシーンをレンダリングする
  • グローテクスチャを通常のシーンに追加的にブレンドしますが、グロー深度テクスチャを使用してオブジェクトをマスクし、輪郭をぼかすだけにします。

これが私のアプローチのスクリーンショットです。

ここに画像の説明を入力してください

グローテクスチャとシーンを組み合わせるフラグメントシェーダーを次に示します。

uniform sampler2D glowColorTex;
uniform sampler2D glowDepthTex;
uniform sampler2D sceneColorTex;
void main()
{
    vec2 uv = gl_TexCoord[0].st;

    vec4 color = texture2D( sceneColorTex, uv);

    float depth = texture2D( glowDepthTex, uv).r;
    if(depth == 1.0) {
        color += 2.0 * texture2D( glowColorTex, uv);
    }

    gl_FragColor = color;
}

ご覧のとおり、ほとんどの部分で機能しているように見えますが、アウトラインのエイリアスは本当に悪いです。

アウトラインの内側のエッジを滑らかにするための提案はありますか?

各ピクセルの隣接する深度値をサンプリングし、1.0に等しい深度値の数に基づいてグローをスケーリングする必要がありますか?

または、よりスムーズな結果を生成するより良いアプローチがありますか?

回答:


13

低解像度の深度バッファに対してチェックする代わりに、ステンシルテストを使用することもできます。通常のシーンをレンダリングするときは、ステンシルバッファーに光るオブジェクト(深度テストなし)をレンダリングしてから、完全なグローテクスチャをブレンドしますが、ステンシルバッファーがある場所のみを通過するようにステンシルテストを構成します設定されていないため、高解像度オブジェクトをマスクします。

この方法では、元のオブジェクトの正確なシルエットを取得できますが、エッジのスムージングでは近似結果しか得られませんが、おそらくこれらで十分です。


ありがとう、それは間違いなく役立ちます。何らかの形のアンチエイリアシングをサポートするテクニックを期待していましたが、これはまだ大きな改善です。
フラッシュ
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.