//canvas und renderer erzeugen: var canvas = document.createElement('canvas'); var renderer = new THREE.WebGLRenderer({canvas: canvas}); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(canvas); //szene initialisieren var scene = new THREE.Scene(); //kamera initialisieren und positionieren var camera = new THREE.PerspectiveCamera(75, renderer.context.canvas.width / renderer.context.canvas.height, 0.1, 1000); camera.position.set(0,0,30); //Lichter hinzufügen var light = new THREE.AmbientLight( 0x404040 ); scene.add( light ); var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.9 ); scene.add( directionalLight ); //Kugel erzeugen und hinzufügen var sphere = new THREE.Mesh(new THREE.SphereGeometry(10, 10, 10), new THREE.MeshNormalMaterial()); scene.add(sphere); //szene initial rendern renderer.render(scene, camera); //kugel drehen function renderScene() { sphere.rotation.y += 0.01; sphere.rotation.x += 0.001; renderer.render(scene, camera); } //für performante Frameaktualisierung: window.requestAnimFrame = (function(){ return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function( callback ){ window.setTimeout(callback, 1000 / 60); }; })(); //rendering ausführen (function animloop(){ requestAnimFrame(animloop); renderScene(); })();