Three.js base

A base/starter fiddle for Three.js

by __jee7__

HTML

<script src="https://rawgit.com/mrdoob/three.js/master/build/three.min.js"></script>
<script src="https://cdn.rawgit.com/mrdoob/stats.js/r17/build/stats.min.js"></script>

CSS

body {
    padding: 0;
    margin: 0;
}
canvas {
  display: block;
}

JavaScript

var camera, scene, renderer, cube;
init();
animate();

function init() {
		scene = new THREE.Scene();
		camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 );

		renderer = new THREE.WebGLRenderer();
		renderer.setSize( window.innerWidth, window.innerHeight );
		document.body.appendChild( renderer.domElement );

		var geometry = new THREE.BoxGeometry( 1, 1, 1 );
		var material = new THREE.MeshBasicMaterial( { color: 0xffffff, vertexColors: THREE.FaceColors});
		cube = new THREE.Mesh( geometry, material );
		
		scene.add( cube );

		camera.position.z = 5;

		
}
function getRandomInt(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min)) + min;
}

function animate() {

			requestAnimationFrame( animate );
			/*cube.geometry.faces[0].color.setRGB(getRandomInt(0, 256), getRandomInt(0, 256), getRandomInt(0, 256));
			cube.geometry.faces[1].color.setRGB(getRandomInt(0, 256), getRandomInt(0, 256), getRandomInt(0, 256));
			cube.geometry.faces[2].color.setRGB(getRandomInt(0, 256), getRandomInt(0, 256), getRandomInt(0, 256));
			cube.geometry.faces[3].color.setRGB(getRandomInt(0, 256), getRandomInt(0, 256), getRandomInt(0, 256));*/
      cube.geometry.faces[0].color.setRGB(Math.random(), Math.random(), Math.random());
			cube.geometry.faces[1].color.setRGB(Math.random(), Math.random(), Math.random());
			cube.geometry.faces[2].color.setRGB(Math.random(), Math.random(), Math.random());
			cube.geometry.faces[3].color.setRGB(Math.random(), Math.random(), Math.random());
      
			cube.geometry.colorsNeedUpdate = true;
			cube.rotation.y += 0.01;
			cube.rotation.x += 0.01;
			

			renderer.render( scene, camera );

}