WEBGL/OPENGLES - 複数のレンダリングに参加するにはどうすればよいですか？ここ

Question

は私の問題だ：

私はリアルタイムでいくつかの効果を比較するために、（異なるフラグメントシェーダと）異なる色で同じシーンをレンダリング に4つの仮想象限に、私がしたいすべての象限にキャンバスをparticionateたいです。私はそれを行う方法がわかりません。 同じシーンを4つの異なるテクスチャで4回レンダリングし、そのテクスチャで4つの矩形を再描画する必要がありますか？または、別のfshaderを作成して、手動でそれらのテクスチャですべてのフラグメントを埋める必要がありますか？レンダリングバッファオブジェクトを使用してパフォーマンスを向上させる可能性はありますか？事前に

おかげで、

Answer 1

（つまり、一つの方法ですが）あなたは、このためのテクスチャにレンダリングする必要はありません。それは実際にgl.viewportでもっと簡単に行うことができます。

gl.viewportは、レンダリングするキャンバスに単純に矩形を設定します。その矩形の外にあるものはすべて切り取られます。通常、あなたがフルスクリーンをレンダリングしたいので、あなたがキャンバスと同じサイズに設定しますが、あなたのケースでは、次の操作を行うことができます。

// Clears the entire scene. gl.clear does not respect the viewport 
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); 

// Render upper left quadrant 
gl.viewport(0, 0, canvas.width/2, canvas.height/2); 
drawSceneWithShader(shader[0]); 

// Render upper right quadrant 
gl.viewport(canvas.width/2, 0, canvas.width/2, canvas.height/2); 
drawSceneWithShader(shader[1]); 

// Render lower left quadrant 
gl.viewport(0, canvas.height/2, canvas.width/2, canvas.height/2); 
drawSceneWithShader(shader[2]); 

// Render lower right quadrant 
gl.viewport(canvas.width/2, canvas.height/2, canvas.width/2, canvas.height/2); 
drawSceneWithShader(shader[3]); 

普通のようなシーン全体をレンダリングレンダリングするときに、あなたがする必要はありません新しいビューポートの説明に特別なことをする。 （マウスピッキングなどを行っている場合は、ビューポートを考慮する必要があります）