AssimpJSONLoader.js 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408
  1. /**
  2. * @author Alexander Gessler / http://www.greentoken.de/
  3. * https://github.com/acgessler
  4. *
  5. * Loader for models imported with Open Asset Import Library (http://assimp.sf.net)
  6. * through assimp2json (https://github.com/acgessler/assimp2json).
  7. *
  8. * Supports any input format that assimp supports, including 3ds, obj, dae, blend,
  9. * fbx, x, ms3d, lwo (and many more).
  10. *
  11. * See webgl_loader_assimp2json example.
  12. */
  13. THREE.AssimpJSONLoader = function ( manager ) {
  14. this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
  15. };
  16. THREE.AssimpJSONLoader.prototype = {
  17. constructor: THREE.AssimpJSONLoader,
  18. load: function ( url, onLoad, onProgress, onError ) {
  19. var scope = this;
  20. this.texturePath = this.texturePath && ( typeof this.texturePath === "string" ) ? this.texturePath : this.extractUrlBase( url );
  21. var loader = new THREE.XHRLoader( this.manager );
  22. loader.setCrossOrigin( this.crossOrigin );
  23. loader.load( url, function ( text ) {
  24. var json = JSON.parse( text ), scene, metadata;
  25. // Check __metadata__ meta header if present
  26. // This header is used to disambiguate between
  27. // different JSON-based file formats.
  28. metadata = json.__metadata__;
  29. if ( typeof metadata !== 'undefined' )
  30. {
  31. // Check if assimp2json at all
  32. if ( metadata.format !== 'assimp2json' ) {
  33. onError( 'Not an assimp2json scene' );
  34. return;
  35. }
  36. // Check major format version
  37. else if ( metadata.version < 100 && metadata.version >= 200 ) {
  38. onError( 'Unsupported assimp2json file format version' );
  39. return;
  40. }
  41. }
  42. scene = scope.parse( json );
  43. onLoad( scene );
  44. }, onProgress, onError );
  45. },
  46. setCrossOrigin: function ( value ) {
  47. this.crossOrigin = value;
  48. },
  49. setTexturePath: function ( value ) {
  50. this.texturePath = value;
  51. },
  52. extractUrlBase: function ( url ) {
  53. // from three/src/loaders/Loader.js
  54. var parts = url.split( '/' );
  55. parts.pop();
  56. return ( parts.length < 1 ? '.' : parts.join( '/' ) ) + '/';
  57. },
  58. parse: function ( json ) {
  59. var meshes = this.parseList ( json.meshes, this.parseMesh );
  60. var materials = this.parseList ( json.materials, this.parseMaterial );
  61. return this.parseObject( json, json.rootnode, meshes, materials );
  62. },
  63. parseList : function( json, handler ) {
  64. var meshes = new Array( json.length );
  65. for ( var i = 0; i < json.length; ++ i ) {
  66. meshes[ i ] = handler.call( this, json[ i ] );
  67. }
  68. return meshes;
  69. },
  70. parseMesh : function( json ) {
  71. var vertex, geometry, i, e, in_data, src;
  72. geometry = new THREE.Geometry();
  73. // read vertex positions
  74. for ( in_data = json.vertices, i = 0, e = in_data.length; i < e; ) {
  75. geometry.vertices.push( new THREE.Vector3( in_data[ i ++ ], in_data[ i ++ ], in_data[ i ++ ] ) );
  76. }
  77. // read faces
  78. var cnt = 0;
  79. for ( in_data = json.faces, i = 0, e = in_data.length; i < e; ++ i ) {
  80. src = in_data[ i ];
  81. face = new THREE.Face3( src[ 0 ],src[ 1 ],src[ 2 ] );
  82. geometry.faces.push( face );
  83. }
  84. // read texture coordinates - three.js attaches them to its faces
  85. json.texturecoords = json.texturecoords || [];
  86. for ( i = 0, e = json.texturecoords.length; i < e; ++ i ) {
  87. function convertTextureCoords( in_uv, out_faces, out_vertex_uvs ) {
  88. var i, e, face, a, b, c;
  89. for ( i = 0, e = out_faces.length; i < e; ++ i ) {
  90. face = out_faces[ i ];
  91. a = face.a * 2;
  92. b = face.b * 2;
  93. c = face.c * 2;
  94. out_vertex_uvs.push( [
  95. new THREE.Vector2( in_uv[ a ], in_uv[ a + 1 ] ),
  96. new THREE.Vector2( in_uv[ b ], in_uv[ b + 1 ] ),
  97. new THREE.Vector2( in_uv[ c ], in_uv[ c + 1 ] )
  98. ] );
  99. }
  100. }
  101. convertTextureCoords( json.texturecoords[ i ], geometry.faces, geometry.faceVertexUvs[ i ] );
  102. }
  103. // read normals - three.js also attaches them to its faces
  104. if ( json.normals ) {
  105. function convertNormals( in_nor, out_faces ) {
  106. var i, e, face, a, b, c;
  107. for ( i = 0, e = out_faces.length; i < e; ++ i ) {
  108. face = out_faces[ i ];
  109. a = face.a * 3;
  110. b = face.b * 3;
  111. c = face.c * 3;
  112. face.vertexNormals = [
  113. new THREE.Vector3( in_nor[ a ], in_nor[ a + 1 ], in_nor[ a + 2 ] ),
  114. new THREE.Vector3( in_nor[ b ], in_nor[ b + 1 ], in_nor[ b + 2 ] ),
  115. new THREE.Vector3( in_nor[ c ], in_nor[ c + 1 ], in_nor[ c + 2 ] )
  116. ];
  117. }
  118. }
  119. convertNormals( json.normals, geometry.faces );
  120. }
  121. // read vertex colors - three.js also attaches them to its faces
  122. if ( json.colors && json.colors[ 0 ] ) {
  123. function convertColors( in_color, out_faces ) {
  124. var i, e, face, a, b, c;
  125. function makeColor( start ) {
  126. var col = new THREE.Color( );
  127. col.setRGB( arr[ 0 ], arr[ 1 ], arr[ 2 ] );
  128. // TODO: what about alpha?
  129. return col;
  130. }
  131. for ( i = 0, e = out_faces.length; i < e; ++ i ) {
  132. face = out_faces[ i ];
  133. a = face.a * 4;
  134. b = face.b * 4;
  135. c = face.c * 4;
  136. face.vertexColors = [
  137. makeColor( a ),
  138. makeColor( b ),
  139. makeColor( c )
  140. ];
  141. }
  142. }
  143. convertColors( json.colors[ 0 ], geometry.faces );
  144. }
  145. //geometry.computeFaceNormals();
  146. //geometry.computeVertexNormals();
  147. //geometry.computeTangents();
  148. geometry.computeBoundingSphere();
  149. // TODO: tangents
  150. return geometry;
  151. },
  152. parseMaterial : function( json ) {
  153. var mat = null,
  154. scope = this, i, prop, has_textures = [],
  155. init_props = {
  156. shading : THREE.SmoothShading
  157. };
  158. function toColor( value_arr ) {
  159. var col = new THREE.Color();
  160. col.setRGB( value_arr[ 0 ], value_arr[ 1 ], value_arr[ 2 ] );
  161. return col;
  162. }
  163. function defaultTexture() {
  164. var im = new Image();
  165. im.width = 1;
  166. im.height = 1;
  167. return new THREE.Texture( im );
  168. }
  169. for ( var i in json.properties ) {
  170. prop = json.properties[ i ];
  171. if ( prop.key === '$tex.file' ) {
  172. // prop.semantic gives the type of the texture
  173. // 1: diffuse
  174. // 2: specular mao
  175. // 5: height map (bumps)
  176. // 6: normal map
  177. // more values (i.e. emissive, environment) are known by assimp and may be relevant
  178. if ( prop.semantic === 1 || prop.semantic === 5 || prop.semantic === 6 || prop.semantic === 2 ) {
  179. ( function( semantic ) {
  180. var loader = new THREE.TextureLoader( scope.manager ),
  181. keyname;
  182. if ( semantic === 1 ) {
  183. keyname = 'map';
  184. }
  185. else if ( semantic === 5 ) {
  186. keyname = 'bumpMap';
  187. }
  188. else if ( semantic === 6 ) {
  189. keyname = 'normalMap';
  190. }
  191. else if ( semantic === 2 ) {
  192. keyname = 'specularMap';
  193. }
  194. has_textures.push( keyname );
  195. loader.setCrossOrigin( this.crossOrigin );
  196. var material_url = scope.texturePath + '/' + prop.value;
  197. material_url = material_url.replace( /\\/g, '/' );
  198. loader.load( material_url, function( tex ) {
  199. if ( tex ) {
  200. // TODO: read texture settings from assimp.
  201. // Wrapping is the default, though.
  202. tex.wrapS = tex.wrapT = THREE.RepeatWrapping;
  203. mat[ keyname ] = tex;
  204. mat.needsUpdate = true;
  205. }
  206. } );
  207. } )( prop.semantic );
  208. }
  209. }
  210. else if ( prop.key === '?mat.name' ) {
  211. init_props.name = prop.value;
  212. }
  213. else if ( prop.key === '$clr.diffuse' ) {
  214. init_props.color = toColor( prop.value );
  215. }
  216. else if ( prop.key === '$clr.specular' ) {
  217. init_props.specular = toColor( prop.value );
  218. }
  219. else if ( prop.key === '$clr.emissive' ) {
  220. init_props.emissive = toColor( prop.value );
  221. }
  222. else if ( prop.key === '$mat.shadingm' ) {
  223. // aiShadingMode_Flat
  224. if ( prop.value === 1 ) {
  225. init_props.shading = THREE.FlatShading;
  226. }
  227. }
  228. else if ( prop.key === '$mat.shininess' ) {
  229. init_props.shininess = prop.value;
  230. }
  231. }
  232. // note: three.js does not like it when a texture is added after the geometry
  233. // has been rendered once, see http://stackoverflow.com/questions/16531759/.
  234. // for this reason we fill all slots upfront with default textures
  235. if ( has_textures.length ) {
  236. for ( i = has_textures.length - 1; i >= 0; -- i ) {
  237. init_props[ has_textures[ i ]] = defaultTexture();
  238. }
  239. }
  240. mat = new THREE.MeshPhongMaterial( init_props );
  241. return mat;
  242. },
  243. parseObject : function( json, node, meshes, materials ) {
  244. var obj = new THREE.Object3D()
  245. , i
  246. , idx
  247. ;
  248. obj.name = node.name || "";
  249. obj.matrix = new THREE.Matrix4().fromArray( node.transformation ).transpose();
  250. obj.matrix.decompose( obj.position, obj.quaternion, obj.scale );
  251. for ( i = 0; node.meshes && i < node.meshes.length; ++ i ) {
  252. idx = node.meshes[ i ];
  253. obj.add( new THREE.Mesh( meshes[ idx ], materials[ json.meshes[ idx ].materialindex ] ) );
  254. }
  255. for ( i = 0; node.children && i < node.children.length; ++ i ) {
  256. obj.add( this.parseObject( json, node.children[ i ], meshes, materials ) );
  257. }
  258. return obj;
  259. },
  260. };