I'm trying to display a simple 3D model using three.js instead of the already implemented view I've made in Unity3D. The model is a fbx file and the texture is a 4096x4096 pixel jpg file.
Following the examples and the documentation I created the scene, but the model shows significant visible craks on it, while the same model and texture is rendered perfectly on Unity.
This is a code snippet showing how I've loaded the model and applied the texture on it:
var loader = new THREE.FBXLoader();
loader.load( 'models/s01.fbx', function ( object ) {
var texture = new THREE.TextureLoader().load( "models/00.jpg" );
object.scale.set( 50,50,50 );
object.rotation.x = - Math.PI / 2;
object.position.set( 0, 100, 0 );
object.traverse( function ( child ) {
if ( child.isMesh ) {
child.material= new THREE.MeshBasicMaterial();
child.material.map = texture;
child.material.needsUpdate = true;
}
} );
scene.add( object );
} );
The result is shown in the following image:
The same model rendered in Unity:
Did I miss something? Thanks
Edit: I suspect that the artifact has to do with the texture and the UV map. This is the texture ( I scaled it):