I’m trying to load this OBJ model:
https://cdn.hexa3d.io/hotlink-ok/test/top.zip
to my scene with OBJLoader + MTLLoader like so:
loadMaterial = (path, options) => {
let mtlLoader = new THREE.MTLLoader();
let file = this.app.utils.getFileFromPath(path);
let justPath = path.substring(0, path.lastIndexOf(file));
mtlLoader.setPath(justPath);
mtlLoader.setTexturePath(justPath);
mtlLoader.load(file.substring(0, file.lastIndexOf('.')) + '.mtl', materials => {
materials.preload();
this.loadOBJ(materials, justPath, file);
});
};
loadOBJ = (materials, justPath, file) => {
let objLoader = new THREE.OBJLoader();
objLoader.setMaterials(materials);
objLoader.setPath(justPath);
this.onLoadStart();
objLoader.load(file, (object) => {
this.app.modelScene.add(object);
}, (xhr) => {
var percentage = Math.ceil(xhr.loaded / xhr.total * 100);
this.onLoading(percentage);
}, this.onLoadError.bind(this));
};
This is how it looks like on other framework (Blend4Web):
This is how it looks like on my three-js viewer:
http://vqa.hexa3d.io/index.html?load=/models/1023273377790346236.obj
Looks like the texture isn’t being mapped to the material or something like that although you can see the image request on the network tab with DevTools.
What am I missing?
Thank you.