如何根据海拔高度改变颜色？

Question

我想实现这样的目标：

但是，我无法获得片段着色器中给定点的 Y 坐标（投影前）。

这是我的片段着色器 :

precision mediump float;

vec4 blue = vec4(0.0, 0.0, 1.0, 1.0);
vec4 pink = vec4(1.0, 0.0, 1.0, 1.0);

void main() {
    float y_coordinates = ???
    gl_FragColor = mix(blue , pink , y_coordinates);
}

我应该从顶点着色器发送它们吗？

Answer 1

将顶点坐标从顶点着色器传递到片段着色器。例如：

顶点着色器

attribute vec3 pos;
varying vec3 vertex_pos;

void main() {
    vertex_pos = pos;
    gl_Position = ...;
}

片段着色器：

precision mediump float;
varying vec3 vertex_pos;

vec4 blue = vec4(0.0, 0.0, 1.0, 1.0);
vec4 pink = vec4(1.0, 0.0, 1.0, 1.0);

void main() {
    gl_FragColor = mix(blue, pink, vertex_pos.y);
}

注意，顶点坐标的y分量必须在[0.0, 1.0]范围内。如果您的坐标在另一个范围内，则必须将其映射到范围 [0.0, 1.0]。例如从 [a, b] 映射到 [0.0, 1.0]:

float w = (vertex_pos.y - a) / (b-a);
gl_FragColor = mix(blue, pink, w);