three.js 1 - rotating cube
my take at a cube rotating three.js demo
HTML
<script src="http://mrdoob.github.com/three.js/build/Three.js"></script>
<script src="http://mrdoob.github.com/three.js/build/Stats.js"></script>
CSS
body {
overflow: hidden;
}
canvas {
margin: auto auto;
width: 600px;
height: 400px;
}
JavaScript
// Generated by CoffeeScript 1.3.1
var App;
App = (function() {
App.name = 'App';
function App() {}
App.prototype.width = 600;
App.prototype.height = 400;
App.prototype.antialias = false;
App.prototype.start = function() {
this.init();
this.animate();
return console.log('running!');
};
App.prototype.init = function() {
this.scene = new THREE.Scene();
this.camera = new THREE.PerspectiveCamera(70, this.width / this.height, 1, 10000);
this.camera.position.y = 150;
this.camera.position.z = 500;
this.scene.add(this.camera);
this.cube = new THREE.Mesh(new THREE.CubeGeometry(100, 100, 100), new THREE.MeshLambertMaterial({
color: 0x00ff00
}));
this.cube.position.y = 150;
this.cube.castShadow = true;
this.scene.add(this.cube);
this.ground = new THREE.Mesh(new THREE.PlaneGeometry(1000, 1000), new THREE.MeshLambertMaterial({
color: 0xe0e0e0
}));
this.ground.receiveShadow = true;
this.scene.add(this.ground);
this.light = new THREE.SpotLight(0xffffff);
this.light.position.set(0, 1500, 0);
this.light.castShadow = true;
this.light.shadowMapWidth = 1024;
this.light.shadowMapHeight = 1024;
this.light.shadowCameraNear = 500;
this.light.shadowCameraFar = 4000;
this.light.shadowCameraFov = 30;
this.scene.add(this.light);
this.renderer = new THREE.CanvasRenderer({
antialias: this.antialias
});
this.renderer.setSize(this.width, this.height);
this.renderer.shadowMapEnabled = true;
document.body.appendChild(this.renderer.domElement);
};
App.prototype.animate = function() {
return this.render();
};
App.prototype.render = function() {
this.cube.rotation.x += 0.01;
this.cube.rotation.y += 0.02;
this.cube.rotation.x += 0.03;
this.camera.lookAt(this.scene.position);
return this.renderer.render(this.scene, this.camera);
};
return App;
})();
var sh = new App();
sh.start();
...