|
|
@@ -35,7 +35,8 @@
|
|
|
<body>
|
|
|
<div id="info">
|
|
|
<a href="http://threejs.org" target="_blank">three.js</a> -
|
|
|
- monster by <a href="http://www.3drt.com/downloads.htm" target="_blank">3drt</a>
|
|
|
+ Jeep by Psionic, interior from
|
|
|
+ <a href="http://assimp.sf.net" target="_blank">Assimp</a>
|
|
|
</div>
|
|
|
|
|
|
<script src="../build/three.min.js"></script>
|
|
|
@@ -47,65 +48,77 @@
|
|
|
|
|
|
<script>
|
|
|
|
|
|
- if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
|
|
|
+ if ( ! Detector.webgl ) {
|
|
|
+ Detector.addGetWebGLMessage();
|
|
|
+ }
|
|
|
|
|
|
- var container, stats;
|
|
|
+ /*
|
|
|
|
|
|
- var camera, scene, renderer, objects;
|
|
|
- var particleLight, pointLight;
|
|
|
- var dae, skin;
|
|
|
+ Simple demo for loading json files generated by assimp2json
|
|
|
+ https://github.com/acgessler/assimp2json
|
|
|
+
|
|
|
+ assimp2json uses assimp (http://assimp.sf.net) to import 40+ 3D file
|
|
|
+ formats, including 3ds, obj, dae, blend, fbx, x, ms3d, lwo (and many
|
|
|
+ more).
|
|
|
+
|
|
|
+ TODOs:
|
|
|
+ - assimp supports skeletal animations and assimp2son exports
|
|
|
+ them. This demo currently doesn't read them.
|
|
|
+ - not all material properties supported by assimp are currently
|
|
|
+ mapped to THREE.js
|
|
|
+
|
|
|
+ The sample files for this demo originate in assimp's repository,
|
|
|
+ and were converted using assimp2json 2.0. The interior file was
|
|
|
+ slightly edited to adjust for lower-case texture names.
|
|
|
|
|
|
+ */
|
|
|
+
|
|
|
+ var container, stats;
|
|
|
+ var camera, scene, renderer, objects;
|
|
|
var clock = new THREE.Clock();
|
|
|
- var morphs = [];
|
|
|
|
|
|
- // Collada model
|
|
|
- var loader = new THREE.AssimpJSONLoader();
|
|
|
- loader.load( 'models/assimp/jeep/jeep1.ms3d.json', function ( assimpjson ) {
|
|
|
+ // init scene
|
|
|
+ init();
|
|
|
+
|
|
|
+ // Load jeep model using the AssimpJSONLoader
|
|
|
+ var loader1 = new THREE.AssimpJSONLoader();
|
|
|
+ loader1.load( 'models/assimp/jeep/jeep1.ms3d.json', function ( assimpjson ) {
|
|
|
+
|
|
|
assimpjson.scale.x = assimpjson.scale.y = assimpjson.scale.z = 0.2;
|
|
|
assimpjson.updateMatrix();
|
|
|
|
|
|
- init(assimpjson);
|
|
|
- animate();
|
|
|
+ scene.add(assimpjson);
|
|
|
} );
|
|
|
|
|
|
- function init(assimpjson) {
|
|
|
|
|
|
- container = document.createElement( 'div' );
|
|
|
- document.body.appendChild( container );
|
|
|
-
|
|
|
- camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 2000 );
|
|
|
- camera.position.set( 2, 4, 5 );
|
|
|
+ // load interior model
|
|
|
+ var loader2 = new THREE.AssimpJSONLoader();
|
|
|
+ loader2.load( 'models/assimp/interior/interior.3ds.json', function ( assimpjson ) {
|
|
|
|
|
|
- scene = new THREE.Scene();
|
|
|
- scene.fog = new THREE.FogExp2( 0x000000, 0.035 );
|
|
|
-
|
|
|
- // Grid
|
|
|
-
|
|
|
- var size = 14, step = 1;
|
|
|
+ assimpjson.scale.x = assimpjson.scale.y = assimpjson.scale.z = 1;
|
|
|
+ assimpjson.updateMatrix();
|
|
|
|
|
|
- var geometry = new THREE.Geometry();
|
|
|
- var material = new THREE.LineBasicMaterial( { color: 0x303030 } );
|
|
|
+ scene.add( assimpjson );
|
|
|
|
|
|
- for ( var i = - size; i <= size; i += step ) {
|
|
|
+ } );
|
|
|
|
|
|
- geometry.vertices.push( new THREE.Vector3( - size, - 0.04, i ) );
|
|
|
- geometry.vertices.push( new THREE.Vector3( size, - 0.04, i ) );
|
|
|
+ animate();
|
|
|
|
|
|
- geometry.vertices.push( new THREE.Vector3( i, - 0.04, - size ) );
|
|
|
- geometry.vertices.push( new THREE.Vector3( i, - 0.04, size ) );
|
|
|
|
|
|
- }
|
|
|
+ //
|
|
|
|
|
|
- var line = new THREE.Line( geometry, material, THREE.LinePieces );
|
|
|
- scene.add( line );
|
|
|
+ function init() {
|
|
|
|
|
|
+ container = document.createElement( 'div' );
|
|
|
+ document.body.appendChild( container );
|
|
|
|
|
|
- // Add the ASSIMPJSON scene
|
|
|
+ camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 2000 );
|
|
|
+ camera.position.set( 2, 4, 5 );
|
|
|
|
|
|
- scene.add( assimpjson );
|
|
|
+ scene = new THREE.Scene();
|
|
|
+ scene.fog = new THREE.FogExp2( 0x000000, 0.035 );
|
|
|
|
|
|
// Lights
|
|
|
-
|
|
|
scene.add( new THREE.AmbientLight( 0xcccccc ) );
|
|
|
|
|
|
var directionalLight = new THREE.DirectionalLight(/*Math.random() * 0xffffff*/0xeeeeee );
|
|
|
@@ -115,24 +128,17 @@
|
|
|
directionalLight.position.normalize();
|
|
|
scene.add( directionalLight );
|
|
|
|
|
|
- //pointLight = new THREE.PointLight( 0xffffff, 4 );
|
|
|
- //pointLight.position = particleLight.position;
|
|
|
- //scene.add( pointLight );
|
|
|
-
|
|
|
// Renderer
|
|
|
-
|
|
|
renderer = new THREE.WebGLRenderer();
|
|
|
renderer.setSize( window.innerWidth, window.innerHeight );
|
|
|
|
|
|
container.appendChild( renderer.domElement );
|
|
|
|
|
|
// Stats
|
|
|
-
|
|
|
stats = new Stats();
|
|
|
container.appendChild( stats.domElement );
|
|
|
|
|
|
// Events
|
|
|
-
|
|
|
window.addEventListener( 'resize', onWindowResize, false );
|
|
|
|
|
|
}
|
|
|
@@ -155,21 +161,12 @@
|
|
|
|
|
|
requestAnimationFrame( animate );
|
|
|
|
|
|
- // animate Collada model
|
|
|
-
|
|
|
- if ( t > 30 ) t = 0;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- // animate morphs
|
|
|
-
|
|
|
- var delta = clock.getDelta();
|
|
|
-
|
|
|
-
|
|
|
render();
|
|
|
stats.update();
|
|
|
}
|
|
|
|
|
|
+ //
|
|
|
+
|
|
|
function render() {
|
|
|
|
|
|
var timer = Date.now() * 0.0005;
|
acgessler