<!DOCTYPE html> <html lang="en"> <head> <title>three.js webgl - collada</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> <style> body { font-family: Monospace; background-color: #000000; margin: 0px; overflow: hidden; } #info { color: #fff; position: absolute; top: 10px; width: 100%; text-align: center; z-index: 100; display:block; } a { color: skyblue } </style> </head> <body> <div id="info"> <a href="http://threejs.org" target="_blank">three.js</a> - simple AWD loader </div> <script src="../build/three.min.js"></script> <script src="js/loaders/AWDLoader.js"></script> <script src="js/controls/OrbitControls.js"></script> <script src="js/Detector.js"></script> <script src="js/libs/stats.min.js"></script> <script> if ( ! Detector.webgl ) Detector.addGetWebGLMessage(); var container, stats; var camera, scene, renderer, objects, controls; var particleLight, pointLight; var trunk; var loader = new THREE.AWDLoader(); loader.materialFactory = createMaterial; loader.load( './models/awd/simple/simple.awd', function ( _trunk ) { trunk = _trunk; init(); render(); } ); function createMaterial( name ){ // console.log( name ); // var mat = new THREE.MeshPhongMaterial({ // color: 0xaaaaaa, // shininess: 20 // }); // return mat; return null; } function init() { container = document.createElement( 'div' ); document.body.appendChild( container ); camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 ); camera.position.set( 70, 50, -100 ); controls = new THREE.OrbitControls( camera ); scene = new THREE.Scene(); // Add the AWD SCENE scene.add( trunk ); // Lights scene.add( new THREE.AmbientLight( 0x606060 ) ); var directionalLight = new THREE.DirectionalLight(/*Math.random() * 0xffffff*/0xeeeeee ); directionalLight.position.set( .2, -1, .2 ); directionalLight.position.normalize(); scene.add( directionalLight ); pointLight = new THREE.PointLight( 0xffffff, .6 ); scene.add( pointLight ); renderer = new THREE.WebGLRenderer(); renderer.setPixelRatio( window.devicePixelRatio ); renderer.setSize( window.innerWidth, window.innerHeight ); container.appendChild( renderer.domElement ); stats = new Stats(); stats.domElement.style.position = 'absolute'; stats.domElement.style.top = '0px'; container.appendChild( stats.domElement ); // window.addEventListener( 'resize', onWindowResize, false ); } function onWindowResize() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize( window.innerWidth, window.innerHeight ); } function render() { requestAnimationFrame( render ); var timer = Date.now() * 0.0005; pointLight.position.x = Math.sin( timer * 4 ) * 3000; pointLight.position.y = 600 pointLight.position.z = Math.cos( timer * 4 ) * 3000; renderer.render( scene, camera ); stats.update(); } </script> </body> </html>