OpenGL ES GL_TRIANGLES漸變問題

Question

我想繪製一個帶有漸變的區域圖。這就是我現在所擁有的。

如果你看紅綠曲線圖，你會發現梯度不看它應該的方式。

編輯：梯度應均勻這樣的：

我使用的OpenGL ES 2.0和GLKit繪製一堆圖表。該圖表使用GL_TRIANGLES繪製。我知道問題在於漸變是爲每個三角形單獨繪製的。

我能想到的唯一方法是使用模板緩衝區。我將在大矩形中繪製漸變，並使用模板將其固定到此形狀。有一個更好的方法嗎？如果不是，你能幫我畫一個指定點的模板嗎？我是OpenGL的新手，對使用模板緩衝區沒有很好的解釋。

Answer 1

您不需要模板緩衝區。我不認爲更多的三角形可能會有所幫助 - 更可能是這會讓您更加困惑，因爲您將爲每個頂點顏色分配中間頂點並且必須自己對其進行插值。

由於您爲頂點插值指定頂點顏色的方式和位置，因此您的漸變將以此方式出現。請注意在輸出和你在尋找什麼樣板間顏色的差異：在每個頂點

你有100％的紅沿着您的圖表的頂部邊緣的每個頂點，和100％的綠色沿着底部邊緣。 OpenGL在每個三角形的面上線性插值顏色，這就是爲什麼在圖的較短部分中有更多紅色。

在您正在尋找的輸出中，圖表的頂部在較短的部分中開始減少紅色，以便在較短的距離內縮短到較短的白色。

有幾種不同的方法可以做到這一點，但可能是最簡單的方法（對於使用GLKBaseEffect而不是編寫自己的着色器的計劃）可能是爲您的漸變使用一維紋理，併爲每個紋理分配一個紋理座標頂點這是正比於它的Y座標圖上的，就像這樣：

（這個例子在我的圖座標假設你圖的頂點覆蓋0.0〜1.0的範圍內，但問題代表不管：垂直紋理每個點的座標應該是圖形總高度的一部分，在0.0到1.0之間。）

或者，你可以看看圖中兩遍：首先，畫你的圖形的形狀，再畫一個四（兩個三角形）覆蓋與梯度整個屏幕，使用適當的glBlendFunc所以只汲取在你用圖形填充的區域。

Answer 2

OpenGL ES可以做你想做的事，但你需要增加你的模型的曲面細分。換句話說，不是隻使用幾個大的三角形，而是需要更多和更小的三角形，頂點顏色變化均勻地分佈在它們上面。這將使您更好地控制漸變。三角形在加速OpenGL ES上很便宜，所以即使增加了100倍，它也不會對性能產生太大影響。

您可能還會考慮一種不同的方法，其中整個圖由一個包含漸變的紋理覆蓋。這將更容易實施。