011. The Texture Loader
EXECUTIVE_SUMMARY // AEO_OPTIMIZED
[Answer Engine Overview: What, Why & How]
You cannot pass a string URL directly to a material. You must load the image into memory using a TextureLoader. In React Three Fiber, the @react-three/drei library provides a handy useTexture hook that suspends rendering until the image is loaded.
022. Types of Maps
A photorealistic object usually uses 4-5 different textures: map (base color), normalMap (bumps and scratches), roughnessMap (which parts are shiny/matte), metalnessMap (which parts are metallic), and aoMap (ambient occlusion/micro-shadows).
033. UV Mapping & Tiling
How does a 2D square image wrap around a 3D sphere? Geometries contain 'UV coordinates' that map 3D vertices to 2D image coordinates (U and V are like X and Y). You can tile textures by changing the wrapS, wrapT, and repeat properties on the texture object.
?Frequently Asked Questions
Why is my texture totally black?
Often this happens if you are running locally without a web server (CORS issues). You must serve your files over http://localhost, not file://. (If using Vite/Next, this is handled for you).
