5

GPU でテクスチャを生成し、それを自分のフレームバッファ オブジェクトにレンダリングしています。それは正常に動作し、テクスチャは他のシェーダーに渡すことができる WebGLTexture にレンダリングされます。ただし、javascript で WebGLTexture ピクセルにアクセスしたいと考えています。それを達成する方法はありますか？

現時点では、テクスチャをフレームバッファに描画した後、 gl.ReadPixels を使用してピクセルを読み取っています。それは問題なく動作しますが、WebGLTextureObject のピクセルに直接アクセスできればもっとよいのではないでしょうか?

私が達成しようとしているのはこれです:GPUで高解像度の高さマップと法線マップをレンダリングできるGLSLパーリンノイズシェーダーがあります。ハイトマップを CPU に渡して、メッシュの頂点を生成できるようにします。もちろん、頂点シェーダーで頂点を配置することもできますが、衝突検出のために CPU で必要です。

私の質問が明確であることを願っています。どんなフィードバックでも大歓迎です！

ありがとう！

4

1 に答える 1

12

フレームバッファにアタッチすることで、ほとんどのテクスチャからピクセルを読み取ることができます。

var fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex, 0);
if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) == gl.FRAMEBUFFER_COMPLETE) {
  var pixels = new Uint8Array(width * height * 4);
  gl.readPixels(x, y, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
}
于 2013-02-25T10:35:33.207 に答える