Lección 4 de 10 · GLSL para principiantes
Las coordenadas
Cada frag sabe dónde está.
Cada frag de la pantalla tiene una posición: dos números, X y Y. X es horizontal (izquierda-derecha), Y es vertical (abajo-arriba). Como en el plano cartesiano.
Posición X, posición Y. El frag sabe. Your decision.
Lo importante: cada frag ejecuta el código por separado, pero conoce su propia posición. El frag de la esquina inferior izquierda sabe que es (0, 0). El de la esquina superior derecha sabe que es el último.
vec2Si
vec3 es un paquete de 3 números, vec2 es un paquete de 2. La usamos para posiciones (X, Y). Aquí p es la posición del frag, dividida entre el tamaño de la pantalla, para que vaya de 0 a 1 en lugar de 0 a 1920.Si pones p.x como rojo, el rojo aumenta hacia la derecha. Si pones p.y como verde, el verde aumenta hacia arriba. El color es la posición.
Cambia
p.x por p.y en la primera línea. ¿Qué pasa? Ahora pon p.x en los tres lugares. ¿Y ahora?El código
void main(){
vec2 p = gl_FragCoord.xy / R;
vec3 col = vec3(p.x, p.y, 0.3 + 0.2 * sin(T * 0.5));
col = hueShift(col, 0.0);
gl_FragColor = vec4(col, 1.);
}