Materials not loading

[lifaon74]

Hello,

I'm trying to load material on an obj but it seems not working : assets.zip

import * as THREE from 'three';
import * as OBJLoader from 'three-obj-loader';
OBJLoader(THREE);
import * as MTLLoader from 'three-mtl-loader';
MTLLoader(THREE);
THREE.MTLLoader = MTLLoader;
// the modules are properly loaded

/*** BASIC SCENE ***/

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000);
const renderer = new THREE.WebGLRenderer();

renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(this.renderer.domElement);

const center = new THREE.AxisHelper(10);
scene.add(this.center);

const alight = new THREE.AmbientLight(0x404040); // soft white light
scene.add(alight);

const light = new THREE.DirectionalLight(0xffffff, 1.0);
light.position.set(1000, 1000, 1000);
scene.add(light);

const light2 = new THREE.DirectionalLight(0xffffff, 1.0);
light2.position.set(-1000, 1000, -1000);
scene.add(light2);

/*** BASIC SCENE END  ***/

const obj = 'assets/siege.obj';
const mtl = 'assets/siege.mtl';

const mtlLoader = new THREE.MTLLoader();
mtlLoader.load(mtl, (materials) => {
  materials.preload();
  const objLoader = new THREE.OBJLoader();
  objLoader.setMaterials(materials);
  objLoader.load(obj, (object) => {
    this.scene.add(object);
  });
});

It result in a pure white seat without materials:

But should be :

Any idea why ?

[lifaon74]

In fact it seems the Object3D are not properly working :

• If I change the material color, nothing append
• The Raycaster doesn't detect the different Meshes

To fix this, I'm doing the following:

let child;
for(let i = 0; i < object.children.length; i++) {
  child = object.children[i];
  scene.add(new THREE.Mesh(child.geometry, new THREE.MeshPhongMaterial({ color: child.material.color.getHex() })));
}

[venku122]

I also had this issue and @lifaon74 your workaround resolved it temporarily for me. I think the issue might be the mtl loader I am using. When inspecting the loaded object, each child-mesh has a material of type THREE.MeshPhongMaterial. When I was not using the module based versions, the type was just MeshPhongMaterial.