Models in Javascript

Question

myColladaLoader = new THREE.ColladaLoader();
myColladaLoader.options.convertUpAxis = true;

myColladaLoader.load( 'car.dae', function ( collada ) {
        // Her the dae in a global variable.
        myDaeFile = collada.scene;

        // Position your model in the scene (world space).
        myDaeFile.position.x = 0;
        myDaeFile.position.y = 5;
        myDaeFile.position.z = 0;

        // Scale your model to the correct size.
        myDaeFile.scale.x = myDaeFile.scale.y = myDaeFile.scale.z = 0.2;
        myDaeFile.updateMatrix();

        // Add the model to the scene.
        scene.add( myDaeFile );
    } );


}

Hello, I'm trying to create a game using models I've exported from 3dsMax. This code wont allow me to import my model for some reason? I've read through the documentation, and also tried it this way:

var loader = new THREE.ColladaLoader();

 loader.load(
// resource URL
'car.dae',
// Function when resource is loaded
function ( collada ) {
    scene.add( collada.scene );
},
// Function called when download progresses
function ( xhr ) {
    console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
}
);

Directly from the documentation. I'm very new to this sort of stuff so please give me guidance! Also, I've tried to use other models that 100% are exported properly so its the code. Not the models.

Thanks for any advice and guidance.

Answer 1

Judging by your comment:

I get this: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource

The reason you are running into this issue is because you are trying to load content with xhr over the file:// protocol rather than http:// or https://.

See this question: "Cross origin requests are only supported for HTTP." error when loading a local file

---

To resolve this, you are going to need to use a web server so that you can serve content over http:// instead of file://. They are fairly easy to setup. Some popular options include:

• Express with node.js
• Apache

However, I would suggest downloading an IDE and having it deal with basic static server stuff automatically. IDE are very useful tools in that they allow you to more easily organize your code and often offer varying tool-chains to make deploying and debugging your code much easier.

I usually use Netbeans. I would suggest creating an HTML5 project. However, I find that Netbeans, while very robust, can be rather heavy for simple projects since it also has support for other programming modules like J2EE, C++, etc. and can often hog a lot memory.

If you would prefer something a little bit lighter, I would also suggest using the Brackets IDE which allows for serving static HTML files very easily and also has support for a myriad of plugins depending on your needs.

Eclipse is another good choice, but tends to be used more for Java Enterprise Web Applications rather than static web pages so I think a lot of its tooling would just get in your way.