Why can't I load the texture into the material?

Questions
, ,
1

I’m looking for a material on which it is clearly visible all the irregularities of geometry.
At the beginning I use MeshNormalMaterial
But it caused a error.

GLTFExporter.js:1138 Uncaught (in promise) TypeError: Cannot read property ‘toArray’ of undefined

Because I used

    let map = new THREE.TextureLoader().load( 'textures/uv_grid_opengl.jpg' );
    map.wrapS = map.wrapT = THREE.RepeatWrapping;
    map.anisotropy = 16;
    let material = new THREE.MeshStandardMaterial( { map: map, color: 0xFF0000, side: THREE.DoubleSide } );

But the texture is not loaded if it is geometry inside the loader

    import { DRACOLoader } from './three/examples/jsm/loaders/DRACOLoader.js';
    const dracoLoader = new DRACOLoader();
    dracoLoader.setDecoderPath( 'three/examples/js/libs/draco/' );
    dracoLoader.setDecoderConfig( { type: 'js' } );
    dracoLoader.load(url, function ( geometry ) {
        geometry.computeVertexNormals();
        const mesh = new THREE.Mesh(geometry, material);
        mesh.castShadow = true;
        mesh.receiveShadow = true;
        group.add(mesh)
        dracoLoader.dispose();
    } );

enter image description here

If I use the usual geometry, then everything works

geometry = new THREE.BoxGeometry(3,3,3);
model = new THREE.Mesh( geometry, material );
scene.add(model)

enter image description here

How can I fix it?

2

Not sure if I understood correctly, but try the following (in the callback after the model is loaded):

loader.load('my/gltf/model.glb', gltf => {
  gltf.scene.traverse(child => {
    if (child.material) {
      child.material = new Three.MeshNormalMaterial(); // NOTE Swap to the material of your choice here
    }
  });

  scene.add(gltf.scene);
});