After implementing the following code:
var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
console.log( item, loaded, total );
};
var texture = new THREE.Texture();
var loader = new THREE.ImageLoader( manager );
loader.load( 'obj/'+model+'.jpg', function ( image ) {
texture.anisotropy = anis;
texture.image = image;
texture.needsUpdate = true;
} );
// model
var loader = new THREE.OBJLoader( manager );
loader.load( 'obj/'+model+'.obj', function ( object ) {
object.traverse( function ( child ) {
if ( child instanceof THREE.Mesh ) {
child.material.map = texture;
if(reflex){
child.material.envMap = reflection;
child.material.shading = THREE.SmoothShading;
child.material.reflectivity = reflex;
}
}
} );
object.scale.set(10,10,10);
object.position.y = pos;
object.position.z = 0;
object.position.x = 0;
object.name = "model";
scene.add( object );
} );
Although everything seems to be functioning fine, there is a visibility issue with all polygons on the model...
In order to achieve smoother textures, I stumbled upon this resource , which suggested using the following method:
// First we want to clone our original geometry.
// Just in case we want to get the low poly version back.
var smooth = THREE.GeometryUtils.clone( geometry );
// Next, we need to merge vertices to clean up any unwanted vertex.
smooth.mergeVertices();
// Create a new instance of the modifier and pass the number of divisions.
var modifier = new THREE.SubdivisionModifier(divisions);
// Apply the modifier to our cloned geometry.
modifier.modify( smooth );
// Finally, add our new detailed geometry to a mesh object and add it to our scene.
var mesh = new THREE.Mesh( smooth, new THREE.MeshPhongMaterial( { color: 0x222222 } ) );
scene.add( mesh );
However, I seem to have hit a roadblock as I am unsure where to fetch the 'geometry' object from... Can anyone offer some guidance?