How to include maya 3D model to three js?

Question

I want to include my 3D model to web page.How to include Maya 3D model to three js?

Answer 1

First you must export your model in obj format. Make sure you have python 2.7 installed.

Then you can convert the obj to js format using the python script which is included in with three.js - convert_obj_three.py

Put both your model and the python script in the same folder as python to make it easier.

Then at the command line run:

python convert_obj_three.py -i infile.obj -o outfile.js

Where infile.obj is the name of your model you exported from maya, and outfile.js is the file you wish to load in three.js.

Once you have a converted file you can load it in with something similar to this script here, I'm creating 3 models but you can use it to load just one:

function loadModel() {
    loader = new THREE.JSONLoader();
    loader.load("js/your_model.js", function( geometry ) {
    box = [];

    group = new THREE.Object3D();
    scene.add(group);

            // here i'm creating 3 objects of same model
    for (var i = 0; i < 3; i++)
    {
        box[i] = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial({map: THREE.ImageUtils.loadTexture("js/your_texture.jpg")}));
        box[i].scale.set(20,20,20);
        box[i].position.x = (120*i) - 150;
        group.add(box[i]);
    }
        callSomeFunctionOnceLoaded();
        },"js"
    );
}