問題タブ [stencil-buffer]

私は拡張現実アプリケーションに取り組んでおり、3 つの異なる種類のジオメトリのレンダリングを並べ替える必要があります。

レベル 1
バックグラウンド ジオメトリ。これは、基本的なアーキテクチャを表す一連の三角形です。壁など

レベル 2
写真飛行機。空間の平面にテクスチャとして配置された建築の写真。その平面は幾何学的にレベル 1 の前にあります (仮想カメラから見て)

レベル 3
動的ジオメトリ。これらは、シーンを拡張するためのボックスなどのプリミティブです。これらはレベル 1 の座標系内に正しく配置されているため、幾何学的にレベル 2 の後ろにあります。

望ましい効果:
a) Level_2 を常に Level_1 の前に描画したい これは、イメージ プレーンをカメラの近くに配置することで自動的に実現されます。

b) Level_1 に対して Level_3 を正しくオクルードして、Level_1 の壁の後ろに部分的に配置されている場合、ダイナミック ボックスの一部を隠したい。これは、通常のパイプラインでも自動的に発生します。デプステストなど

c) Level_3 のすべての Fragments/Pixel を、実際には Level_2 の背後にある場合でも、Level_2 の上に描画したいと考えています。この効果により、オブジェクトが写真の一部に遮られているように見えるはずです。

「sortkey」属性を介してこの効果を達成できるX3Dom（webglにレンダリングされる）にアプリケーションがあるため、これが可能であることを知っています。しかし、純粋な OpenGL では同じ効果を再現できませんでした。Stencilbuffer または Z-Buffer トリックの単純な使用法であると考えましたが、機能しません。Level_3 ジオメトリに「常にパス」を与えるにはどうすればよいですか? または、Level_2 が Level_1 のみを非表示にし、Level_3 が両方の前にある場合でも、Level_3 を非表示にするにはどうすればよいですか?

基本的に:
1) Level_2 は Level_1 を隠します
2) Level_1 と Level_3 は互いに遮ります
3) Level_3 の可視部分 (Level_1 に対して) は Level_2 によって遮られません

何か助けはありますか？

ありがとう！

OpenGL でステンシル マスクを作成しようとしています。私はこのソース ( http://open.gl/depthstencils、より具体的にはhttp://open.gl/content/code/c5_reflection.txt ) のモデルに従っていますが、私が知る限り、適切に例に従いました。私のコードは、1 つの正方形のステンシルを描画し、その上に別の正方形を描画しています。最初の正方形と同じスペースを覆っている 2 番目の回転する緑色の正方形の部分だけが見えると思っていました。私が実際に見ているのは、重なり合った 2 つの正方形で、1 つは透明度なしで回転しています。この例との顕著な違いの 1 つは、テクスチャを使用していないことです。問題ありますか？これはもっと簡単な例だと思いました。

私は ES2.0 にかなり慣れていないので、明らかにばかげたことをしている場合はお知らせください。

初期化:

描画ループ:

編集:次のシェーダーのものは、私が抱えていた問題とは無関係です。ステンシルはシェーダーでは行われません。

頂点シェーダー:

フラグメント シェーダー:

私は、WebGL でステンシル バッファーを半作業的に使用しています。これは Firefox では正常に動作しますが、Chrome (および Internet Explorer も同様) では失敗します。ステンシルが無視されることを除いて、アプリケーションの残りの部分は引き続きエラーなしで機能します。

ここでは、Firefox がステンシルを正しく作成しているため、緑色の長方形がレンダリングされ、穴が開いています。ここに jsFiddle のデモがあります: http://jsfiddle.net/XH9eC/3/

ステンシル モードをオンにして、カラー マスクをオフにします。

次に、画面中央の正方形をレンダリングします

次に、ステンシル モードを変更し、色をオンにします。

最後に緑の背景をレンダリングします。

重要な場合は、これが背景と正方形のステンシルをレンダリングするために使用するコードです (異なる頂点を使用するだけです)。

私は他のコードでこの問題に遭遇しましたが、まだ修正していません。Chrome で使用されているステンシル バッファーの他の例を見てきました。

これに似たクリッピング マスクを作成する方法を調査しています(SVG で作成)。

私の調査結果に基づいて、ステンシルによってこれを達成することにしました。しかし、私の実装はひどく間違っています。メインコンテンツを2回マスキングするフラグメントをレンダリングする必要があるように見えるため、どのようgl.stencilOpに機能するかは完全にはわかりません。gl.stencilFuncメイン コンテンツをレンダリングする前に 1 回、さまざまなパラメーターを使用してレンダリングした後に 1 回。

動作テストは次のとおりです: https://dl.dropboxusercontent.com/u/1595444/experiments/two.js/issues/issue-56/stencil-buffer/test/clip.html

このテストの関連するスニペット/部分は、次の場所にあり../src/renderers/webgl.jsますL67。

svg の例のように動作するように webgl ステンシルをエミュレートするためのガイダンスをいただければ幸いです。

オブジェクトを描画するために正射投影法を使用しています。各オブジェクト項目は異なるバッファに追加され、数サイクルで描画されます。各オブジェクトに四角形のアウトラインがあり、その四角形を (異なる色で) 塗りつぶしているとします。だから私は最初にすべての塗りつぶしを描き、次にアウトラインを描いています。

写真に示すように、アウトラインがすべての塗りつぶしにかからないようにするために深度バッファーを使用しています

現在、各オブジェクトに別の描画アイテム (テキスト - ポイントなど) が含まれているという問題に直面しています。これは、この正方形よりも長くなる可能性があります。だから私は正方形の上にこの追加の描画をカットするためにステンシル バッファを使用しています。ただし、これを行う場合、深度バッファは考慮されません。1 つのテキスト項目を他の正方形の上に描画できることを意味します。以下に示すように。

とにかくそれを実現するための\トリックはありますか?

私は libgdx エンジンで 3d アプリに取り組んでいます。

decalBatch がステンシル バッファーに描画されていないことがわかりました。3D ワールド用のステンシル マスクを作成したかったのですが、まったく機能しません。

これはスプライト バッチでは機能するコードですが、デカール バッチでは機能しません。助けてください！

編集：

Depth バッファーをクリアし、DepthMask を有効または無効にする必要があることがわかりましたが、うまくいきません。

少し丸みを帯びた長方形を作成しようとしています - これらはゲームのプラットフォームになるという考えです - 真っ白な長方形を作成し、黒い長方形で輪郭を描き、角に円を配置します。簡単にするために、私の問題は本質的にこれと同じです: 2 つの重なり合うオブジェクトに対して opengl でブレンド関数を設定する方法

私はステンシル テストを使用してこれに取り組みたいと考えています。調べたところ、ステンシル テストは良い方法だと思われるからです。

プラットフォーム オブジェクトのレンダリング関数は次のようになります。

内部、左、下、上、および右はすべて、私自身の Polygon クラスのオブジェクトであり、基本的には特定のポリゴンの三角形を描画するだけです (実際、現在は、私が気付いたばかりの四角形しか描画できません... しかし、脱線します)

私が理解している限り、これが私のプログラムの動作方法です。

1. ステンシル テストがオンになり、glStencilFunc と glStencilOp への最初の呼び出しで、ステンシル バッファーの領域も 1 に変更されます。
2. プラットフォームの内側の長方形が描画されます。この領域は、ステンシル バッファー上ですべて 1 になるはずです。
3. glStencilFunc を呼び出すと、ステンシル値が 1 の領域を描画できないようになりました
4. プラットフォームの境界が描画されます。技術的には、これらの四角形は境界線の幅の半分まで内側の四角形と重なっていますが、内側の四角形はステンシル バッファー上ですべて 1 であるため、そこには何も描画されません。
5. 最終的に、角に円をレンダリングします。(境界線を描画すると、ステンシル バッファー内のこれらの領域もすべて 1 に変更される必要があるのはそのためです)。

だから、私は自分の研究をしたような気がしますが、実際にはうまくいきません. ステンシルを機能させるために欠落している可能性のある主要な OpenGL 機能は 3 つありますか?

障害物セットが厳密にカメラとテスト対象オブジェクトの間にあることが先験的にわかっている場合、デプス テストを完全に無効にしてもオクルージョン クエリは機能しますか? これは、パフォーマンスを向上させるための試みです。論理的には、オクルーダーがオクルーディーの背後にない場合、複雑な z テストは必要ありません。

次のコマンドを使用して、色/深度/ステンシル バッファーを初期化しています。