//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();
})();