1

私は WebGL のテーマに非常に慣れていません。私がやりたいことは、下の図のような 6 つの異なるフレームバッファの平均色を計算することです。今、私はそれについて最善の方法は何だろうと思っていますか？やってみました

gl.readPixels(0, 0, 256, 256, gl.RGBA, gl.UNSIGNED_BYTE, pixelValues);

しかし、それは非常に遅いようです...これがグラフィックカードで発生する方法はありますか?

ここに画像の説明を入力

this is how the FBO is set up - I have this from a tutorial:

...
4

2 に答える 2

2

頭のてっぺんから

  1. 6つのfboを作成します。
  2. 各fboが、レンダーバッファではなく、テクスチャアタッチメントで作成されていることを確認してください。
  3. 6つのシーンを6つのfboにレンダリングします
  4. テクスチャごとにgl.generateMipmap（...）を呼び出します
  5. 6つのテクスチャを取得し、バイアスオプションを指定したtexture2Dを使用してそれらを平均化するシェーダーを作成します。テクスチャのレベル数にバイアスを設定します。これは、GPUに最小レベルを使用するように指示するためのものです。
  6. そのシェーダーを使用してユニットクワッドを1ピクセルfbo（またはバックバッファーの1ピクセル）にレンダリングします。
  7. その1ピクセルでgl.readpixelsを呼び出します。

シェーダーはこんな感じになると思います

-フラグメントシェーダー--

precision mediump float;

uniform sampler2D u_textures[6];
uniform float u_bias;

void main() {
   // since we know we are rendering only with the last mip
   // then there is only 1 texel.
   vec2 center = vec2(0.5, 0.5);
   vec4 sum = 
     texture2D(u_textures[0], center, u_bias) +
     texture2D(u_textures[1], center, u_bias) +
     texture2D(u_textures[2], center, u_bias) +
     texture2D(u_textures[3], center, u_bias) +
     texture2D(u_textures[4], center, u_bias) +
     texture2D(u_textures[5], center, u_bias);
   gl_FragColor = sum / 6.0;
}
于 2012-12-14T07:32:18.237 に答える
1

2 つのオプションがあります

  1. クワッド (1 x テクスチャの高さ) をレンダリングして行ごと (テクスチャごと) に 1 回実行し、行内のすべてのピクセルを実行してそれらを平均化するフラグメント シェーダーを記述します。平均化された行でこのプロセスを繰り返すと、画像全体の平均が得られます。これをストリームリダクションと呼びます
  2. FBO でglGenerateMipMapを呼び出してから、最高レベルのミップマップにアクセスします ( glGetTexLevelParameterでこのミップマップのパラメーターを取得します)。これで、大幅に削減され平均化されたミップ画像で ReadPixels メソッドを使用するか、GLSL を使用することができます。これははるかに高速です。
于 2012-12-13T19:04:04.147 に答える