Shader Learn

05 Data becomes vertices

Rasterization: which pixels a triangle covers

Each cell is a pixel. Only pixels whose centre falls inside the triangle run the fragment shader.

648
0.050.95

Runs once per pixelDrag numbers, or edit the code

JS sidegl.uniform2f(uResolution, …, …)

Rasterization finds the pixel centres a triangle covers; the barycentric coordinates w0, w1, w2 decide each pixel’s interpolated values — that is a varying.

Try it

  • Make the cells coarse and see which sample points count as inside
  • Turn on interpolation: the three vertex colours blend
  • Pixel debugger: read w0 + w1 + w2 — it is always 1