問題タブ [fragment-shader]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
1205 参照

javascript - テクスチャへの WebGL レンダリング - アルファ チャネルにデータを書き込むにはどうすればよいですか?

これを前置きするために、この記事http://http.developer.nvidia.com/GPUGems2/gpugems2_chapter19.htmlで説明されている水レンダリング アルゴリズムを複製しようとしています。このアルゴリズムの一部では、最初にレンダリングされたシーンからのテクスチャ サンプリングに後で使用するために、アルファ マスクをフレーム バッファにレンダリングする必要があります。要するに、アルゴリズムは次のようになります。

  1. シーン ジオメトリをテクスチャSにレンダリングし、屈折メッシュをスキップしてアルファ マスクに置き換えます。
  2. アルファ マスク内にある場合は摂動を使用してテクスチャSをサンプリングすることにより、屈折メッシュをレンダリングします。それ以外の場合は、テクスチャSを直接サンプリングします。

残念ながら、私はまだ WebGL を学んでおり、これにアプローチする方法を知るのに十分な知識がありません。さらに、その記事は HLSL を使用しており、変換は私にとって重要です。明らかに、フラグメント シェーダーでこれを実行しようとしてもうまくいきません。

以前にレンダリングされたジオメトリとブレンドされ、アルファ値は 1.0 のままになるためです。

ここに私が持っているものの簡単な概要があります:

コード全体はhttp://scottrabin.github.com/Terrain/にあります。

0 投票する
1 に答える
523 参照

opengl-es - フラグメントシェーダー-青のチャンネルレベルの出力スライダーを再現

フォトショップレベルの出力スライダーと同じ仕事をするフラグメントシェーダーを作成しようとしています。特定のチャンネル(この場合は青)でこれを実行したいと思います。

私は以下のようなコードを持っています:

これは結果の画像には影響しないので、次の行でさらに多くのことを行う必要があると思います。

誰かが私を正しい方向に向けるのを手伝ってもらえますか?

ありがとう

0 投票する
0 に答える
2028 参照

ios - iOS-UIImageをテクスチャとしてシェーダーに渡します

UIImageをGLSLシェーダーに渡そうとしています。フラグメントシェーダーは次のとおりです。

私がやりたいのは、カメラから画像を送信し、テクスチャと乗算ブレンドすることです。カメラからデータを送信するだけで、すべて問題ありません。したがって、問題は別のテクスチャをシェーダーに送信することにあるはずです。私はそれをこのようにやっています:

テクスチャの均一性は問題ありません。glGetUniformLocation関数は-1を返しません。テクスチャは解像度2000x2000ピクセルのPNGファイルです。

問題:テクスチャがシェーダーに渡されると、「黒い画面」が表示されます。おそらく問題は、CGContextのパラメーターまたは関数glTexImage2Dのパラメーターです。

更新:描画サイクルごとに均一にするためにテクスチャユニット番号を渡す必要があることがわかりました。すべてが正常に機能します。本当に必要ですか?

ありがとうございました

0 投票する
1 に答える
7569 参照

opengl - 均一なSampler2D(lwjgl)を使用するフラグメントシェーダーの実装

シェーダーを正常に実行できず、すべてを機能させるための手順が不足しているようです。私は次のエラーで終わります:

私の初期化は次のように始まります。

createShaderメソッドは次のようになります。

次に、シェーダーを特定のスプライトに次のようにアタッチします。

これは単純です:

intシェーダーは、以前にSpritesコンストラクターで次のように初期化されています。

これは以前の問題でしたが、もはや明らかではありません。ここで、実際のエラーが発生した場所に到達します。スプライト(この場合は2つ)の描画メソッドで、次のようになります。

そして、エラーは次の行で発生します。

そして参考のために私のシェーダー:

チュートリアルを読み、エラーについて読みましたが、どのステップを逃したのかわかりません。

0 投票する
2 に答える
314 参照

opengl-es - 複数のバッファがアタッチされていない、より大きなGLSLフラグメント出力

それ以上を放出する方法はありますか?実装が複数のFBOバッファーアタッチメントまたは「ディープ」バッファー形式をサポートしていない場合、GLSLフラグメントシェーダーから4バイト?

たとえば、WebGLまたはOpenGL ESを使用する場合、フラグメントごとにRGBA出力に制限すると、計算の一部を複数のパスで繰り返してより多くの出力チャネルを取得する必要がある場合、複雑な計算は非常に非効率になります。

0 投票する
1 に答える
18079 参照

opengl - GLSLを使用してsampler2Dから特定の座標でピクセルの色を見つける

シーンに 3D オブジェクトがあり、このオブジェクトのフラグメント シェーダーは画面と同じサイズのテクスチャを受け取ります。現在のフラグメントから座標を取得し、同じ位置にある画像の色情報を見つけたいです。これは可能ですか?誰かが私を正しい方向に向けることができますか?

0 投票する
1 に答える
1829 参照

opengl-es - GLSL Shader - 2D オブジェクトの Coverflow 反射

カバーフローに使用されるものと同様の画像の反射を作成するシェーダーを作成したいと考えています。

しかし、このシェーダーは以下を作成してい ます:元の画像の下部に画像を反映する方法を知っています。

0 投票する
2 に答える
2082 参照

opengl - フラグメント シェーダーの GLSL アトミック カウンター (および分岐)

フラグメント シェーダーは、2 つのアトミック カウンターを使用します。最初の値をインクリメントする場合としない場合と、2 番目の値をインクリメントする場合としない場合があります (ただし、両方をインクリメントすることはありません)。ただし、カウンターを変更する前に、現在の値が常に読み取られ、カウンターが後で変更された場合、以前に読み取られた値がカスタム ロジックに使用されます。これはすべて (ほとんどの場合展開可能な) ループで発生します。

大まかに次のようなフローを想像してください。

  • FOR 0-20(コンパイル時に解決可能なconst)など、いくつかの小さな展開可能なループで...
  • AC1 と AC2 のカウンター値を取得する
  • いくつかの値を確認してください:
  • x の場合: uimage1D_A のテクセルをインデックス AC1 に設定し、AC1 をインクリメントします。
  • それ以外: uimage1D_B のインデックス (imgwidth-AC2-1) にテクセルを設定し、AC2 をインクリメントします。

質問: シェーダーは現在のカウンター値を照会します。常に「最新」の値を取得しますか? ここで、フラグメント シェーダーの大規模な並列性が失われますか (現在の世代および将来の GPU とドライバーに関してのみ)?

分岐 (if x) については、別の ( readonly restrict uniform)のテクセルをuimage1D( uniform)と比較しuintます。したがって、一方のオペランドは間違いなく均一なスカラーですが、もう一方はimageLoad().x画像は均一ですが、この種の分岐はまだ「完全に並列化」されていますか? 両方の分岐がそれぞれ正確に 2 つのほぼ同一の命令であることがわかります。「完全に最適化された」GLSL コンパイラを想定すると、この種の分岐はストールを引き起こす可能性がありますか?