8

これ ( http://madebyevan.com/webgl-water/ ) を THREEに移植しようとしています。私は近づいていると思います(今のところシミュレーションが必要です。コースティクス/屈折はまだ気にしません)。GPUブースト用のシェーダーで動作させたいです。

シェーダーを使用した現在の THREE セットアップは次のとおりです: http://jsfiddle.net/EqLL9/2/ (2 番目の小さい平面は、現在 WebGLRenderTarget にあるものをデバッグするためのものです)

私が苦労しているのは、WebGLRenderTarget (私の例では rtTexture) からデータを読み取ることです。この例では、中心点を囲む 4 つの頂点が上に移動していることがわかります。変位の唯一のポイントである中心点から開始するため、これは正しいです (1 シミュレーション ステップ後)。

rtTexture からデータを読み戻して、フレームごとにデータ テクスチャ (buf1) を更新できれば、シミュレーションは適切にアニメーション化されるはずです。WebGLRenderTarget からデータを直接読み取るにはどうすればよいですか? すべての例は、データをターゲットから読み取るのではなく、ターゲットに送信する (レンダリングする) 方法を示しています。それとも、私はそれをすべて間違っていますか?複数のテクスチャで作業し、Evan が行ったのと同じように前後に入れ替える必要があると何かが言っています。

TL;DR: 次のような呼び出しの後、WebGLRenderTarget から DataTexture にデータをコピーするにはどうすればよいですか。
// render to rtTexture
renderer.render( sceneRTT, cameraRTT, rtTexture, true );

編集: jsfiddle /gero3/UyGD8/9/ で解決策が見つかった可能性があります。調査して報告します。

4

1 に答える 1