01 Fragmentos y datos

Coordenadas de pantalla y resolución

Posición del píxel ÷ resolución = coordenada de pantalla entre 0 y 1.

Posición del píxel…, …

Píxeles por celda24

1100

Se ejecuta una vez por píxelArrastra los números o edita el código

void main() {
  vec2 pixel = floor(gl_FragCoord.xy / 24.000) * 24.000;
  vec2 screenUv = pixel / uResolution;
  vec3 color = vec3(screenUv, 0.3);
  gl_FragColor = vec4(color, 1.0);
}

void main() {
  vec2 pixel = floor(gl_FragCoord.xy / 24.000) * 24.000;
  vec2 screenUv = pixel / uResolution;
  vec3 color = vec3(screenUv, 0.3);
  gl_FragColor = vec4(color, 1.0);
}

Lado JSgl.uniform2f(uResolution, …, …)

gl_FragCoord es la posición del píxel; divídela por uResolution para obtener una coordenada de pantalla entre 0 y 1.

Pruébalo

Pon los píxeles por celda en 1: cada píxel es distinto
Mueve el puntero y compara la posición del píxel con la coordenada entre 0 y 1