Seeing the mip levels
A custom chain, one colour per level: a DataTexture with mipmaps set by hand. LinearMipmapNearestFilter picks one level per pixel, so the bands have hard edges. This is the same chain three.js builds for you, with the averaged picture instead of a colour.
A screen pixel rarely covers exactly one texel. Filtering decides how texels are blended when the picture is magnified or shrunk. Mipmaps and anisotropy keep a far floor from shimmering or turning to mush.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 4 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
A road texture looks blurry in the distance but sharp near the camera. Which one setting do you change, and what does it cost?
How many mip levels does a 2048 × 2048 texture have?
Explain it without notes
Why does a far floor flicker when the camera moves, and what is the fix?
What does anisotropic filtering add that mipmaps do not?
Console
Nothing logged yet.Expected console output
levels: 64x64, 32x32, 16x16, 8x8, 4x4, 2x2, 1x1