OpenGL中的三角形渐变

Question

OpenGL中的三角形渐变

5

我想制作如下图片右侧的三角形，需要从顶点1和2投影出一个颜色渐变到C。但据我所知这是不可能的，因为顶点C必须有自己的颜色，这也会混合到顶点1和2的颜色中，就像图片左侧的三角形。如果将C设置为中间点的颜色，则会产生不良结果，因为三角形越高，其他顶点的颜色就越不明显。 C1线应该是黑色，C2线应该是白色。在OpenGL中有没有实现这个的方法？

- Leo

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Thomas · Accepted Answer

有两种方法，但我不知道哪种对您的应用程序更有意义。在非常高的层面上：

将纹理映射到三角形。由于渐变非常平滑，因此不需要非常高的分辨率，您可以让线性滤波为您完成工作。
使用着色器。设置更多，但也更加灵活，并且可以在任何比例/分辨率下给您“完美”的结果。

更新：如果您要使用着色器，则想法如下。

从顶点着色器传递可变的vec2坐标到片段着色器。将点1的值设置为0,0，将点2的值设置为1,0，将点C的值设置为0,1。要将这些值传递到顶点着色器中，请使用属性。可变值将在三角形上进行插值，就像纹理坐标和颜色一样。因此，coords变量将被映射到您的三角形上，如下所示：

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

片段着色器接收哈希区域内某个地方的“coords”值。为了确定需要混合每种颜色的数量，计算通过“coords”和“0,1”的线，并找到它与“x”轴的交点。由于“coords”的坐标系，这是一项简单的操作：只需将“coords.x”除以“coords.y”。将其称为“f”。（请注意，在点C处会出现除以零的情况，但这是预期的，因为您从未在那里定义过颜色。如果需要，您可以在着色器中显式检查它。）

使用“c”表示“coords”，用“.”字符表示该线，最终“f”会落在0到1之间：

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

现在假设您有uniform vec4 colour1和uniform vec4 colour2来分别定义点1和点2的颜色。那么简单地混合它们：取colour2的f部分和colour1的1-f部分并将它们加在一起。GLSL的mix函数正是这样做的。