CODEWITHSUNDEEP
three.js
Ayma
Ayma

Reputation: 359

How to use GLTF Loader in three.js? Texture and material displaying as black

I'm having issues loading a gltf. The model is able to load successfully but all the textures and materials (already embedded in the .gltf) are completely black. When I view it in the gltfviewer, all the textures and materials show up correctly. I'm new to three.js so if anyone can walk me through using the GLTF loader, I would greatly appreciate it!!

Upvotes: 6

Views: 9144

Answers (1)

Don McCurdy
Don McCurdy

Reputation: 11960

This issue is essentially the same as How to use AmbientLight in combination with MeshStandardMaterial? — your model has a 100% metallic material, and pure metals do not reflect diffuse (ambient and hemisphere) lights.

Ideally, always add an environment map to PBR models. Another solution is to add non-diffuse/direct lights, such as PointLight or DirectionalLight instances. If you are able to edit the model, reducing its metalness would also work.

For more details, see https://github.com/mrdoob/three.js/issues/9228.

Upvotes: 10

Related Questions