04 Texturas y ruido

Texturas: buscar un color por su dirección

Das una UV y obtienes un color de la textura.

Escala UV1.00

0.55

Desplazamiento UV0.00

-11

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

void main() {
  vec2 uv = vUv * 1.000 + vec2(0.000, 0.0);
  vec3 color = texture2D(uTexture, uv).rgb;
  gl_FragColor = vec4(color, 1.0);
}

void main() {
  vec2 uv = vUv * 1.000 + vec2(0.000, 0.0);
  vec3 color = texture2D(uTexture, uv).rgb;
  gl_FragColor = vec4(color, 1.0);
}

Lado JS

gl.bindTexture(gl.TEXTURE_2D, texture)
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT)
gl.uniform1i(uTextureLocation, 0) // unidad de textura 0

Un sampler2D apunta a una imagen; texture2D(tex, uv) busca un color en una UV. JS configura qué ocurre fuera de 0–1.

Pruébalo

Pon la escala en 3: el patrón se repite
En el código, sustituye uv por uv * uv y observa cómo se curva el patrón