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.

Yes, I get this: Cross origin requests are only supported for protocol schemes: http ,data, chrome, chrome-extension, https, chrome-extension-resource — , Mar 09 '16 at 16:13
Are you testing locally? Do you have a web server installed (eg: apache) to serve static files? — XCS, Mar 09 '16 at 16:17
Yeah testing locally but no web server as not needed (according to lecturers). We set up Chrome to allow it to work (according to lecturers) — , Mar 09 '16 at 16:19
When you run your site, is the address like `file://some.file.html` or `http://localhost/blah.html`? If it's the former, you will need a web server in order to host your content and retrieve it with `xhr`. It's very easy to setup and if you use an appropriate IDE, it's almost automatic. — zero298, Mar 09 '16 at 16:20
Its the first one, no localhost. I think i misunderstood Cristy. — , Mar 09 '16 at 16:22
If this helps. When I look at my error sources it throws load @ ColladaLoder.js:113 - which is a line 'request.send(null); — , Mar 09 '16 at 16:23

score 0 · Accepted Answer · edited May 23 '17 at 12:09

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:

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.

I will download Netbeans IDE to see if that solves my issues, but according to my lecturer I should be able to import my models without. I hope you're right cause this is driving me mad! Thanks for your help — , Mar 09 '16 at 16:31

Models in Javascript

1 Answers1