OpenGl片段着色器用于渐变与颜色的热点？

Question

我对opengl很新，我正在尝试重新创建这种效果

即。在硬编码颜色之间的一种渐变，颜色来自某些硬编码位置

我确实理解基本概念，我已经在两种给定颜色之间制作了线性渐变的演示，但这显然是不够的。

#ifdef GL_ES
precision mediump float;
#endif

#extension GL_OES_standard_derivatives : enable

uniform float time;
uniform vec2 mouse;
uniform vec2 resolution;

float lerp(float start, float end, float fraction) {
    return start + ((end - start) * fraction);
}

void main( void ) {
    vec4 beginColor = vec4(0.21, 1.0, 0.78, 1.0);
    vec4 endColor = vec4(1.0, 0.48, 0.21, 1.0);
    vec2 position = gl_FragCoord.xy / resolution.xy;

    vec4 color = vec4(
        lerp(beginColor.x, endColor.x, position.x),
        lerp(beginColor.y, endColor.y, position.x),
        lerp(beginColor.z, endColor.z, position.x),
        1.0);
    gl_FragColor = color;
}

如何创建这些＆＃34;来源＆＃34;颜色？也许多个径向渐变混合在一起？ （可能不是）

Answer 1

如果可能的话，我不会在像素着色器批发中这样做。相反，我会在每个颜色中心放置带有颜色的顶点，使用Delaunay triangulation创建面（直到此点发生在CPU上的所有内容），然后使用最基本的顶点颜色插值渲染网格以获得结束结果

如果你真的只想使用一个像素着色器，那么我猜你需要迭代所有色心，找到三个最接近的色中心形成一个三角形，用这个三角形中的重心坐标表示当前位置，最后使用坐标作为插值三种颜色的权重。这似乎是一个坏主意，因为你基本上都在复制GPU为你做的所有工作。