How to import obj and mtl file to three.js

Question

I am having a hard time importing these obj and mtl files to load a model at three js.I try this code:

var loader = new THREE.OBJMTLLoader();

loader.load ("test.obj", "test.mtl"); loader.addEventListener("load", function (object) {scene.add(object);}, false);

Should i do something more? I found out something about importing scripts like js/OBJMTLLoader.js to the html.if so should i download them from somewhere?

The object paths in loader.load() are most probably wrong. Take a look at the example threejs.org/examples/#webgl_loader_obj_mtl and try to load your object. — gaitat
no the path is correct and i am aware of the example you shared..i have them at the same folder with the script to load them. I cant find any errors..any additional help? — prieston
<My OBJMLTLoader.js was wrong! > please could you tell me what was wrong with it? — steveOw

prieston prieston · Accepted Answer · 2015-10-01T18:44:46

            var onProgress = function ( xhr ) {
                if ( xhr.lengthComputable ) {
                    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() );

        if (name == "House"){
            var loader = new THREE.OBJMTLLoader();
            loader.load( 'models/House/house_obj/house_obj.obj', 'models/House/house_obj/house_obj.mtl', function ( object ) {
                object.traverse( function ( child ) {

                    if ( child instanceof THREE.Mesh ) {

                        child.material.side = THREE.DoubleSide;

                    }

                } );


                object.rotation.x = Math.PI/2;
                 var scale = 0.15/ (MapWidth*0.5/3);//upsos tabani
                object.scale.set(scale,scale,scale);
                House = object;


            }, onProgress, onError );
            }

this is the code i used.. In this example i check if the user select to insert a house model. The onProgress and onError functions state the completeness of the loader. I use OBJMTLLoader.js and DDSLoader.js

How to import obj and mtl file to three.js

1 Answers