WebGLでの加算ブレンドを使用したエラー

Question

JavaScriptとwebglでゲームエンジンを開発しています。前方レンダリング手法を使用して、シーン内の光源ごとに1回パスします。

私は2回目のパスのために追加のブレンドを使用しています。透明なテクスチャでオブジェクトを照らす必要がある場合を除いて、かなりうまく動作します。この場合、私は下の図に見られる厄介なアーティファクトを得ます。シーン内のオブジェクトはz（遠くから近い）でソートされ、透明なオブジェクトは不透明なオブジェクトの後にレンダリングされます。私はgl.ONE - gl.ONEというブレンド関数を使用していますが、正直言って、意味を成す可能性のあるすべての可能な組み合わせをランダムに試しました。

誰でもこの問題を解決する方法のヒントを教えてくれますか？

Answer 1

私は同様の問題だと思うものをデバッグしています。私が発見したのは、基本ページが1未満のアルファを持つピクセルで表示されているということです。ブレンドが無効になっている場合でも、またはブレンドモードが設定されている場合でも、これを取得しているようです。これをデバッグする1つの方法は、ページの背景色を変更し、結果が変わるかどうかを確認することです。

'alpha'にtrueを指定している場合、WebGLコンテキストを作成するときにチェックします。その場合は、falseに変更してみてください。つまり、ブラウザはキャンバスを完全に不透明に扱います。