1

これを前置きするために、この記事http://http.developer.nvidia.com/GPUGems2/gpugems2_chapter19.htmlで説明されている水レンダリング アルゴリズムを複製しようとしています。このアルゴリズムの一部では、最初にレンダリングされたシーンからのテクスチャ サンプリングに後で使用するために、アルファ マスクをフレーム バッファにレンダリングする必要があります。要するに、アルゴリズムは次のようになります。

  1. シーン ジオメトリをテクスチャSにレンダリングし、屈折メッシュをスキップしてアルファ マスクに置き換えます。
  2. アルファ マスク内にある場合は摂動を使用してテクスチャSをサンプリングすることにより、屈折メッシュをレンダリングします。それ以外の場合は、テクスチャSを直接サンプリングします。

残念ながら、私はまだ WebGL を学んでおり、これにアプローチする方法を知るのに十分な知識がありません。さらに、その記事は HLSL を使用しており、変換は私にとって重要です。明らかに、フラグメント シェーダーでこれを実行しようとしてもうまくいきません。

void main( void ) {
    gl_FragColor = vec4( 0.0 );
}

以前にレンダリングされたジオメトリとブレンドされ、アルファ値は 1.0 のままになるためです。

ここに私が持っているものの簡単な概要があります：

function animate(){
    ... snip ...
    renderer.render( scene, camera, rtTexture, true );

    renderer.render( screenScene, screenCamera );
}

// water fragment shader
void main( void ){
    // black out the alpha channel
    gl_FragColor = vec4(0.0);
}

// screen fragment shader 
varying vec2 vUv;
uniform sampler2D screenTex;

void main( void ) {
    gl_FragColor = texture2D( screenTex, vUv );

    // just trying to see what the alpha mask would look like
    if( gl_FragColor.a < 0.1 ){
        gl_FragColor.b = 1.0;
    }
}

コード全体はhttp://scottrabin.github.com/Terrain/にあります。

4

1 に答える 1

0

明らかに、フラグメント シェーダーでこれを実行しようとしてもうまくいきません。以前にレンダリングされたジオメトリとブレンドされるだけで、アルファ値は 1.0 のままになるからです。

それはあなた次第です。適切なブレンド モードを使用するだけです。

glBlendFuncSeparate(..., ..., GL_ONE, GL_ZERO);

glBlendFuncSeparate色の RGB 部分とアルファ部分の個別のブレンドを設定します。この場合、ソース アルファを宛先に直接書き込みます。

不透明なものを描画している場合は、ブレンド モードは必要ないことに注意してください。出力アルファは、色と同じようにそのまま書き込まれます。

于 2012-02-19T16:08:05.690 に答える