GLTFLoader.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.GLTFLoader = function ( manager ) {
  5. this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
  6. };
  7. THREE.GLTFLoader.prototype = {
  8. constructor: THREE.GLTFLoader,
  9. load: function ( url, onLoad, onProgress, onError ) {
  10. var scope = this;
  11. var loader = new THREE.XHRLoader( scope.manager );
  12. loader.load( url, function ( text ) {
  13. onLoad( scope.parse( JSON.parse( text ) ) );
  14. }, onProgress, onError );
  15. },
  16. setCrossOrigin: function ( value ) {
  17. this.crossOrigin = value;
  18. },
  19. parse: function ( json ) {
  20. function stringToArrayBuffer( string ) {
  21. var bytes = atob( string );
  22. var buffer = new ArrayBuffer( bytes.length );
  23. var bufferView = new Uint8Array( buffer );
  24. for ( var i = 0; i < bytes.length; i ++ ) {
  25. bufferView[ i ] = bytes.charCodeAt( i );
  26. }
  27. return buffer;
  28. }
  29. console.time( 'GLTFLoader' );
  30. var library = {
  31. buffers: {},
  32. bufferViews: {},
  33. accessors: {},
  34. meshes: {},
  35. nodes: {},
  36. scenes: {}
  37. };
  38. // buffers
  39. var buffers = json.buffers;
  40. for ( var bufferId in buffers ) {
  41. var buffer = buffers[ bufferId ];
  42. if ( buffer.type === 'arraybuffer' ) {
  43. var header = 'data:application/octet-stream;base64,';
  44. if ( buffer.uri.indexOf( header ) === 0 ) {
  45. library.buffers[ bufferId ] = stringToArrayBuffer( buffer.uri.substr( header.length ) );
  46. }
  47. }
  48. }
  49. // buffer views
  50. var bufferViews = json.bufferViews;
  51. for ( var bufferViewId in bufferViews ) {
  52. var bufferView = bufferViews[ bufferViewId ];
  53. var arraybuffer = library.buffers[ bufferView.buffer ];
  54. library.bufferViews[ bufferViewId ] = arraybuffer.slice( bufferView.byteOffset, bufferView.byteOffset + bufferView.byteLength );
  55. }
  56. // accessors
  57. var COMPONENT_TYPES = {
  58. 5120: Int8Array,
  59. 5121: Uint8Array,
  60. 5122: Int16Array,
  61. 5123: Uint16Array,
  62. 5126: Float32Array,
  63. };
  64. var TYPE_SIZES = {
  65. 'SCALAR': 1, 'VEC2': 2, 'VEC3': 3, 'VEC4': 4,
  66. 'MAT2': 4, 'MAT3': 9, 'MAT4': 16
  67. };
  68. var accessors = json.accessors;
  69. for ( var accessorId in accessors ) {
  70. var accessor = accessors[ accessorId ];
  71. var arraybuffer = library.bufferViews[ accessor.bufferView ];
  72. var itemSize = TYPE_SIZES[ accessor.type ];
  73. var TypedArray = COMPONENT_TYPES[ accessor.componentType ];
  74. var array = new TypedArray( arraybuffer, accessor.byteOffset, accessor.count * itemSize );
  75. library.accessors[ accessorId ] = new THREE.BufferAttribute( array, itemSize );
  76. }
  77. // meshes
  78. var meshes = json.meshes;
  79. for ( var meshId in meshes ) {
  80. var mesh = meshes[ meshId ];
  81. var geometries = {
  82. name: mesh.name,
  83. array: []
  84. };
  85. var primitives = mesh.primitives;
  86. for ( var i = 0; i < primitives.length; i ++ ) {
  87. var primitive = primitives[ i ];
  88. var attributes = primitive.attributes;
  89. var geometry = new THREE.BufferGeometry();
  90. if ( primitive.indices ) {
  91. geometry.setIndex( library.accessors[ primitive.indices ] );
  92. }
  93. for ( var attributeId in attributes ) {
  94. var attribute = attributes[ attributeId ];
  95. var bufferAttribute = library.accessors[ attribute ];
  96. switch ( attributeId ) {
  97. case 'POSITION':
  98. geometry.addAttribute( 'position', bufferAttribute );
  99. break;
  100. case 'NORMAL':
  101. geometry.addAttribute( 'normal', bufferAttribute );
  102. break;
  103. case 'TEXCOORD_0':
  104. geometry.addAttribute( 'uv', bufferAttribute );
  105. break;
  106. }
  107. }
  108. geometries.array.push( geometry );
  109. }
  110. library.meshes[ meshId ] = geometries;
  111. }
  112. // nodes
  113. var nodes = json.nodes;
  114. var matrix = new THREE.Matrix4();
  115. for ( var nodeId in nodes ) {
  116. var node = nodes[ nodeId ];
  117. var object = new THREE.Group();
  118. object.name = node.name;
  119. if ( node.translation !== undefined ) {
  120. object.position.fromArray( node.translation );
  121. }
  122. if ( node.rotation !== undefined ) {
  123. object.quaternion.fromArray( node.rotation );
  124. }
  125. if ( node.scale !== undefined ) {
  126. object.scale.fromArray( node.scale );
  127. }
  128. if ( node.matrix !== undefined ) {
  129. matrix.fromArray( node.matrix );
  130. matrix.decompose( object.position, object.quaternion, object.scale );
  131. }
  132. if ( node.meshes !== undefined ) {
  133. for ( var i = 0; i < node.meshes.length; i ++ ) {
  134. var meshId = node.meshes[ i ];
  135. var geometries = library.meshes[ meshId ];
  136. var group = new THREE.Group();
  137. group.name = geometries.name;
  138. object.add( group );
  139. var array = geometries.array;
  140. for ( var j = 0; j < array.length; j ++ ) {
  141. group.add( new THREE.Mesh( array[ j ], new THREE.MeshNormalMaterial() ) );
  142. }
  143. }
  144. }
  145. library.nodes[ nodeId ] = object;
  146. }
  147. for ( var nodeId in nodes ) {
  148. var node = nodes[ nodeId ];
  149. for ( var i = 0; i < node.children.length; i ++ ) {
  150. var child = node.children[ i ];
  151. library.nodes[ nodeId ].add( library.nodes[ child ] );
  152. }
  153. }
  154. // scenes
  155. var scenes = json.scenes;
  156. for ( var sceneId in scenes ) {
  157. var scene = scenes[ sceneId ];
  158. var container = new THREE.Scene();
  159. for ( var i = 0; i < scene.nodes.length; i ++ ) {
  160. var node = scene.nodes[ i ];
  161. container.add( library.nodes[ node ] );
  162. }
  163. library.scenes[ sceneId ] = container;
  164. }
  165. console.timeEnd( 'GLTFLoader' );
  166. return {
  167. scene: library.scenes[ json.scene ]
  168. };
  169. }
  170. };