Three.js + 3d model .obj

3DObjectView.js

/*
 * IndexView.js
 *
 */

var THREEDObjectView = Backbone.View.extend({
	'events': {},

	'initialize': function(options) {
		_.bindAll(this, 'render', 'createScene');
		App.bind('show:index', this.render);

		log('Backbone : IndexView : Initialized');
	},

	'render': function() {
		var view = this;

		// set the scene size
		view.WIDTH = 600;
		view.HEIGHT = 600;

		// set some camera attributes
		view.VIEW_ANGLE = 60;
		view.ASPECT = view.WIDTH / view.HEIGHT;
		view.NEAR = 0.1;
		view.FAR = 10000;

		// create a WebGL renderer, camera
		// and a scene
		view.renderer = new THREE.WebGLRenderer();
		view.camera = new THREE.PerspectiveCamera(view.VIEW_ANGLE, view.ASPECT, view.NEAR, view.FAR);
		view.scene = new THREE.Scene();

		// add the camera to the scene
		view.scene.add(view.camera);

		// the camera starts at 0,0,0
		// so pull it back
		view.camera.position.z = 24;

		// start the renderer
		view.renderer.setSize(view.WIDTH, view.HEIGHT);

		// attach the render-supplied DOM element
		this.$el.append(view.renderer.domElement);

		// load the 3D object
		view.jsonLoader = new THREE.JSONLoader();
		view.jsonLoader.load('files/elephant.js', view.createScene);

	},
	'createScene': function(geometry) {
		var view = this;

		view.mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial());

		// add the sphere to the scene
		view.scene.add(view.mesh);

		// create a point light
		view.pointLight = new THREE.PointLight(0xFFFFFF);

		// set its position
		view.pointLight.position.x = 10;
		view.pointLight.position.y = 50;
		view.pointLight.position.z = 130;

		// add to the scene
		view.scene.add(view.pointLight);

		//render
		view.renderer.render(view.scene, view.camera);
	}

});