I'm attempting to apply a png file onto an mtl/obj file.
Prior to mapping
However, after mapping, the mtl texture seems to disappear.
After mapping
What should I do? My English skills are not great. If you have trouble understanding my question, please leave a comment.
This is my code:
var onProgress = function(xhr) {
var percentComplete = xhr.loaded / xhr.total * 100;
console.log(Math.round(percentComplete, 2) + '% downloaded');
};
var onError = function(xhr) {};
THREE.Loader.Handlers.add(/\.dds$/i, new THREE.DDSLoader());
var loader = new THREE.ImageLoader();
loader.load("../img/ang.png", function(image) {
texture.minFilter = THREE.LinearFilter;
texture.image = image;
texture.wrapS = THREE.ClampToEdgeWrapping;
texture.wrapT = THREE.ClampToEdgeWrapping;
texture.offset.set(-3, -9.5);
texture.repeat.set(13, 13);
texture.needsUpdate = true;
},onProgress,onError);
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath('../models/');
mtlLoader.load('nag-green.mtl', function(materials) {
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials(materials);
objLoader.setPath('../models/');
objLoader.load('nag-green.obj', function(object) {
object.traverse(function(child) {
if (child instanceof THREE.Mesh) {
child.material.map = texture;
}
});
object.name = "object";
object.position.y = 0;
scene.add(object);
}, onProgress, onError);
});
My goal is to map the 'ang.png' file over the t-shirt in this manner
Thank you for your suggestion Radio, I tried that approach but it doesn't achieve what I intend to do.