0

I am trying to get my model to stand out and be more recognizable in my scene. I found this glb file on a car which I am trying to use, but it comes out very dark and hard to see.

I am simply trying to add some bright color to it, with perhaps some shading so it will clearly be identifiable as a car.

This is what it looks like in Creators3D Online Viewer.

Car rendered

Here's my code so far for loading it (but without apply the material)

var loader = new THREE.GLTFLoader();
loader.load(
  'https://srv-file19.gofile.io/download/FXLEpw/99-low-poly-cars-free_fbx.glb',
  function(gltf) {

    console.log('gltf', gltf);
    scene.add(gltf.scene);

    var model = gltf.scene;
    model.position.set(0, 0, 2);
    model.rotation.set(0, 90, 0);

    // How do I apply this texture to the car?
   var material = new THREE.MeshBasicMaterial({
    color: 0x00ff00,
    vertexColors: THREE.FaceColors
   });

  },
  function(xhr) {
    console.log('xhr', (xhr.loaded / xhr.total * 100) + '% loaded');
  },
  function(error) {
    console.log('An error happened', error);
  }
);
raphisama
  • 396
  • 3
  • 11
  • Does this answer your question? [How to override GLTF materials in three.js](https://stackoverflow.com/questions/56660584/how-to-override-gltf-materials-in-three-js) – Don McCurdy Aug 31 '20 at 05:50
  • Also note that the `vertexColors` option won't change anything here — if the model had vertex colors, they would already be enabled by GLTFLoader. – Don McCurdy Aug 31 '20 at 05:51
  • Yea it seems the gltf didn't include any textures or materials – raphisama Aug 31 '20 at 13:04

1 Answers1

2

simply with mesh.material = yourMat

//Material

  var mat001 = new THREE.MeshPhysicalMaterial();
  mat001.color = new THREE.Color("gold");
  mat001.reflectivity = 1.0;
  mat001.roughness = 0.0;
  mat001.envMapIntensity = 1.0;

  //MODEL from loader
  var mesh01;
  loader.scene.traverse(function (child) {
    if (child.isMesh) {
      mesh01 = child;
      child.material = mat001; // This is
      scene.add(mesh01);
      mesh01.scale.set(1, 1, 1);
    }
  });
Cid-Wings
  • 449
  • 1
  • 6
  • 13