Chessboard Texture is not showing (gltf Loader)

Questions
, ,
1

Hi, I’m new here and new to Blender

I downloaded this (BlenderKit: Download the FREE Chess Game model) Chessboard Model from Blender and then loaded it into my three.js scene.

loader = new GLTFLoader();
loader.load( '/chess.glb', (gltf) => {
    chess = gltf.scene.children[0];
    
    scene.add(chess);
  }, undefined, (error) => {
    console.error(error);
  });

The Problem is that the chessboard texture is not loaded correctly. The dark squares are not visible.
How can I export this in Blender that the texture is shown correctly in my three.js scene?

Thank you very much in advance

2
  1. How are you loading the model?
  2. Does the model appear correctly if dropped here ?
  3. Are the textures embedded within the model file or exported externally?
3

Paste the original model

4

Thank you very much for your answer.

  1. I updated my question so you can see how I load it with the GLTFLoader.
  2. No it looks the same as in my try. The dark squares are not visible.
  3. In Blender the chessboard is correct and then I export the Model as a glTF 2.0. Do i need some extra steps here to export the Texture correctly?
5

Most .blend files you find online cannot be exported, a model needs to be made with export to a specific format in mind, from the start. When exporting to glTF, materials should follow the guidelines here:

https://docs.blender.org/manual/en/latest/addons/import_export/scene_gltf2.html

If there are more complex node graphs in this .blend, they would need to be baked down to textures using something like SimpleBake. It might be easier to look for downloadable files on Sketchfab, which would already be in glTF format.