OpenGL上的三角形渐变

Question

我正在尝试制作一个像下图中右边的三角形：

问题在于我想要实现的是从C顶点1和2的颜色渐变。

据我所知这是不可能的，因为顶点C必须有自己的颜色，它也会混合成1和2的颜色，就像图片的左三角形一样。 如果我将C设置为中点颜色，则会产生不希望的结果，因为三角形越高，其他顶点的颜色就越不明显。

C1行应为黑色，C2行应为白色。

有没有办法在OpenGL中实现这个目标？

Answer 1

有两种方法，但我不知道哪种方式对您的应用最有意义。处于非常高的水平：

1. 将纹理映射到三角形。由于渐变非常平滑，因此不需要非常高的分辨率，您可以让线性过滤为您完成工作。

2. 使用着色器。更多设置工作，但也更灵活，并以任何比例/分辨率为您提供“完美”的结果。

---

更新：如果你打算使用着色器，我的想法如下。

将varying vec2 coords从顶点着色器传递到片段着色器。将点1的值设置为0,0，将点2设置为1,0，将点C设置为0,1。要将这些值放入顶点着色器，请使用attribute。不同的值将在三角形内插，非常类似于纹理坐标和颜色。因此，coords变量将映射到您的三角形，如下所示：

y
1 +-----+
  |\    |
  |#\   |
  |##\  |
  |###\ |
  |####\|
0 +-----+ x
  0     1

片段着色器在散列区域内的某处接收coords值。要计算出需要混合的每种颜色的多少，请计算coords和0,1之间的直线，并找到它与x轴的交点。感谢coords的坐标系，这是一个简单的操作：只需将coords.x除以coords.y。请拨打此f。 （请注意，这将在C点给出除以零，但这是预期的，因为您从未在那里定义颜色。如果需要，可以在着色器中明确检查。）

使用coords表示c并使用.字符表示行，f最终介于0和1之间：

y
1 +-----+
  |\    |
  |.\   |
  |#c\  |
  |#.#\ |
  |##.#\|
0 +--f--+ x
  0     1

现在假设你有uniform vec4 colour1和uniform vec4 colour2来分别定义第1点和第2点的颜色。然后，混合这些是一个简单的问题：取f colour2的{​​{1}}分数和1-f colour1分数并将它们加在一起。 GLSL mix函数就是这样做的。