07 Superficies y luz
De puntos a sólido, y después iluminar la superficie
Activa los interruptores en orden o por separado para comparar cada paso. El modelo gira despacio para distinguir frente, dorso, luz y sombra.
Ejercicio
Arrastra los números o edita el código
posición → superficievec3 p = vec3(aUv * 2.0 - 1.0, 0.0);gl_Position = P * V * M * vec4(p, 1.0);
M / V / P: modelo → cámara → proyección.
normal → color basevec3 N = normalize(vNormal);vec3 base = vec3(0.48, 0.83, 0.69);
N es la orientación de la superficie; al convertirla a RGB puedes ver su dirección.
luz → sombreadofloat diffuse = 1.0;float shine = 0.0;
L apunta a la luz; H está a medio camino entre luz y vista.
color → salidavec3 color = base * diffuse + vec3(shine);gl_FragColor = vec4(color, 1.0);
Alfa, con mezcla, lo hace transparente.
Puntos de vértices · la luz se incorpora al color; JS decide qué puntos forman caras.
Lado JS
gl.uniformMatrix4fv(uModel, …) // rotación -0.35 / 0.10Repaso: posición → triángulos → normales → difusa → especular → transparencia; cada paso es una línea de código.
Pruébalo
- Activa los interruptores de arriba abajo