Homework0
by oKLo
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r78/three.min.js"></script>
<script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js">
</script>
CSS
<style>
body {
overflow: hidden
}
</style>
JavaScript
var renderer, scene, camera;
var controls, cube,cube2,cylinder,train;
var angle = 0; // initialization IMPORTANT!
init();
animate();
function init () {
renderer = new THREE.WebGLRenderer();
document.body.appendChild (renderer.domElement);
var width = window.innerWidth;
var height = window.innerHeight;
renderer.setSize (width, height);
renderer.setClearColor (0x888888);
scene = new THREE.Scene();
var grid = new THREE.GridHelper(10,1, 0xaaaa00, 0x333333);
scene.add (grid);
var axes = new THREE.AxisHelper (5);
scene.add (axes);
camera = new THREE.PerspectiveCamera (35, width/height, 1, 100);
camera.position.y = 16;
camera.position.z = 40;
camera.lookAt (new THREE.Vector3(0,0,0));
controls = new THREE.OrbitControls(camera, renderer.domElement);
window.addEventListener('resize', onWindowResize, false);
///////////////////////////////////////////////////////////////
train= new THREE.Object3D();
/*var cubeGeometry = new THREE.BoxGeometry (3,1,2);
var cubeMaterial = new THREE.MeshNormalMaterial();
cube = new THREE.Mesh (cubeGeometry, cubeMaterial);
cube.position.y = 0.5;
train.add( cube );*/
var cubeGeometry = new THREE.CylinderBufferGeometry( 1, 1, 2.2, 32);
var cubeMaterial = new THREE.MeshNormalMaterial();
cylinder = new THREE.Mesh( cubeGeometry, cubeMaterial );
cylinder.position.z=-2.3;
cylinder.position.y=2.3;
train.add( cylinder );
var cubeGeometry = new THREE.BoxGeometry (3.8,1.2,6.8);
var cubeMaterial = new THREE.MeshNormalMaterial();
cube2 = new THREE.Mesh (cubeGeometry, cubeMaterial);
cube2.position.x = 0;
cube2.position.y = 0.6;
train.add( cube2 );
scene.add (train);
}
function onWindowResize() {
var width = window.innerWidth;
var height = window.innerHeight;
camera.aspect = width / height;
camera.updateProjectionMatrix();
renderer.setSize(width, height);
}
function animate() {
angle -= 0.01;
train.position.set (8*Math.cos(angle),0, 8*Math.sin(angle));
train.rotation.y =...