1

HDR によるブルーム ポスト プロセス エフェクトの実装に取り​​組んでいます。私は、同じ効果を行うためのオンライン チュートリアルであるが、最新バージョンの OpenGL に基づいている (チュートリアル) 足場を使用しています。シェーダー スクリプト用に OpenGl ES 2.0 で WebGL 1.0 を使用しています。例は、この renderBuffer 生成スクリプトです (注 4 行目):

rboDepth = gl.createRenderbuffer()
        gl.bindRenderbuffer(gl.RENDERBUFFER, rboDepth);
        gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT, gl.viewportWidth, gl.viewportHeight);
        glFramebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, rboDepth);
        // - Tell OpenGL which color attachments we'll use (of this framebuffer) for rendering 
        var attachments = [ gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1 ];
        glDrawBuffers(2, attachments);
        // - Finally check if framebuffer is complete
        if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE)
            alert("Framebuffer not complete!" );
4

1 に答える 1

0

drawBuffers は、WebGL の拡張機能として利用できますWEBGL_draw_buffers。使用するには、拡張子を確認してください

var ext = gl.getExtension("WEBGL_draw_buffers");
if (!ext) {
  alert("no WEBGL_draw_buffers: sucks to be you");
  ...
} 

上記のコードをそのまま実行したい場合は、このように WebGL コンテキストにコピーできます。

for (var key in ext) {
  var value = ext[key];
  if (typeof value === 'function') {
    value = value.bind(ext);
  }
  // remove WEBGL suffix
  var newKey = key.replace(/_?WEBGL/, '');
  gl[newKey] = value;
}

残念ながら、少なくともwebglstats.com WEBGL_draw_buffersによると、約 60% のデバイスでしかサポートされていません。数が非常に少ないことに少しショックを受けていますが、drawBuffers の設定に関連する重大なバグが多くのドライバーにあることは知っています。これらは、一般的な方法でセットアップした場合は機能しましたが、あまり一般的でない方法でセットアップした場合はドライバーがクラッシュしました。これはブラウザには受け入れられないため、既知のバグがあるデバイスではこの機能がブラックリストに登録されています。しばらくの間、NVidiaチップを搭載したOSXに当てはまったことは知っていますが、NVidiaを搭載したOSXデバイスでこれを入力していて、ドローバッファがWebGLで利用できるため、修正されたことを知っています

とにかく、それが drawBuffers を取得する方法です。拡張機能が利用できない場合は、ちょっと運が悪いです。利用できない場合の解決策WEBGL_draw_buffers

  1. 描画バッファごとに 1 回、複数回レンダリングする

    ええ、本当に遅いです

  2. ドローバッファを必要としない他の低品質のレンダリングにフォールバックします

  3. 運が悪いことをユーザーに伝えます。

于 2016-05-06T11:54:18.197 に答える