1

WebGLカラーミックス計算アルゴリズムとは何ですか?4方向のグラデーションカラー塗りつぶしで四角形を描画する必要があり、3方向のグラデーションの三角形(このように)を使用して、四角形の中心を計算し、そのような点を4つの三角形に使用して、グラデーションの滑らかさの最良の結果を得ることにしました。これを正しく行うには、WebGLが3方向グラデーション塗りつぶしのカラーミックスを計算するのと同じ方法で、四角形の中心の色を計算する必要があります。そのような計算の公式は何ですか?

4

1 に答える 1

4

WebGLは、頂点属性に線形補間を使用します。四隅のサンプルを指定して正方形全体の値を補間する式は、単純に2回適用される線形補間です。GLSLでは、

mix(mix(color00, color01, y), mix(color10, color11, y), x)

特に中心点に興味があるなら、これはただ

0.25 * (color00 + color01 + color10 + color11)

ただし、WebGLアプリケーションで、正方形全体で4つの色をスムーズに補間することが目標である場合は、実際にこの計算を自分で実行する必要はなく、4つの三角形を使用する必要もありません。

  1. 4色で2×2のテクスチャを作成します。
  2. に設定TEXTURE_MAG_FILTERLINEARます。
  3. 通常の方法で適用されたテクスチャを使用して正方形を描画しますが、テクスチャ座標はからまでの範囲0.25です0.75

これにより、探しているのと同じ補間が実行されますが、組み込みの機能が使用されます。必要に応じて、テクスチャの使用をスキップすることもできますが、それでも「テクスチャ」座標を使用し、mix上記の式を使用して座標を4色にマッピングします。

これが機能する理由は、任意の色とは異なり、テクスチャ座標が3点間を線形補間すると非縮退結果が得られ、4色すべての値を考慮して色を検索するために使用できるためです。

于 2012-06-30T19:32:55.230 に答える