OBJLoader.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.OBJLoader = function ( manager ) {
  5. this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
  6. this.materials = null;
  7. this.regexp = {
  8. // v float float float
  9. vertex_pattern : /^v\s+([\d|\.|\+|\-|e|E]+)\s+([\d|\.|\+|\-|e|E]+)\s+([\d|\.|\+|\-|e|E]+)/,
  10. // vn float float float
  11. normal_pattern : /^vn\s+([\d|\.|\+|\-|e|E]+)\s+([\d|\.|\+|\-|e|E]+)\s+([\d|\.|\+|\-|e|E]+)/,
  12. // vt float float
  13. uv_pattern : /^vt\s+([\d|\.|\+|\-|e|E]+)\s+([\d|\.|\+|\-|e|E]+)/,
  14. // f vertex vertex vertex
  15. face_vertex : /^f\s+(-?\d+)\s+(-?\d+)\s+(-?\d+)(?:\s+(-?\d+))?/,
  16. // f vertex/uv vertex/uv vertex/uv
  17. face_vertex_uv : /^f\s+(-?\d+)\/(-?\d+)\s+(-?\d+)\/(-?\d+)\s+(-?\d+)\/(-?\d+)(?:\s+(-?\d+)\/(-?\d+))?/,
  18. // f vertex/uv/normal vertex/uv/normal vertex/uv/normal
  19. face_vertex_uv_normal : /^f\s+(-?\d+)\/(-?\d+)\/(-?\d+)\s+(-?\d+)\/(-?\d+)\/(-?\d+)\s+(-?\d+)\/(-?\d+)\/(-?\d+)(?:\s+(-?\d+)\/(-?\d+)\/(-?\d+))?/,
  20. // f vertex//normal vertex//normal vertex//normal
  21. face_vertex_normal : /^f\s+(-?\d+)\/\/(-?\d+)\s+(-?\d+)\/\/(-?\d+)\s+(-?\d+)\/\/(-?\d+)(?:\s+(-?\d+)\/\/(-?\d+))?/,
  22. // o object_name | g group_name
  23. object_pattern : /^[og]\s*(.+)?/,
  24. // s boolean
  25. smoothing_pattern : /^s\s+(\d+|on|off)/,
  26. // mtllib file_reference
  27. material_library_pattern : /^mtllib /,
  28. // usemtl material_name
  29. material_use_pattern : /^usemtl /
  30. };
  31. };
  32. THREE.OBJLoader.prototype = {
  33. constructor: THREE.OBJLoader,
  34. load: function ( url, onLoad, onProgress, onError ) {
  35. var scope = this;
  36. var loader = new THREE.XHRLoader( scope.manager );
  37. loader.setPath( this.path );
  38. loader.load( url, function ( text ) {
  39. onLoad( scope.parse( text ) );
  40. }, onProgress, onError );
  41. },
  42. setPath: function ( value ) {
  43. this.path = value;
  44. },
  45. setMaterials: function ( materials ) {
  46. this.materials = materials;
  47. },
  48. _createParserState : function () {
  49. var state = {
  50. objects : [],
  51. object : {},
  52. vertices : [],
  53. normals : [],
  54. uvs : [],
  55. materialLibraries : [],
  56. startObject: function ( name, fromDeclaration ) {
  57. // If the current object (initial from reset) is not from a g/o declaration in the parsed
  58. // file. We need to use it for the first parsed g/o to keep things in sync.
  59. if ( this.object && this.object.fromDeclaration === false ) {
  60. this.object.name = name;
  61. this.object.fromDeclaration = ( fromDeclaration !== false );
  62. return;
  63. }
  64. if ( this.object && typeof this.object._finalize === 'function' ) {
  65. this.object._finalize();
  66. }
  67. this.object = {
  68. name : name || '',
  69. fromDeclaration : ( fromDeclaration !== false ),
  70. geometry : {
  71. vertices : [],
  72. normals : [],
  73. uvs : []
  74. },
  75. materials : [],
  76. smooth : true,
  77. startMaterial : function( name, libraries ) {
  78. var previous = this._finalize( false );
  79. var material = {
  80. index : this.materials.length,
  81. name : name || '',
  82. mtllib : ( Array.isArray( libraries ) && libraries.length > 0 ? libraries[ libraries.length - 1 ] : '' ),
  83. smooth : ( previous !== undefined ? previous.smooth : this.smooth ),
  84. groupStart : ( previous !== undefined ? previous.groupEnd : 0 ),
  85. groupEnd : -1,
  86. groupCount : -1
  87. };
  88. this.materials.push( material );
  89. return material;
  90. },
  91. currentMaterial : function() {
  92. if ( this.materials.length > 0 ) {
  93. return this.materials[ this.materials.length - 1 ];
  94. }
  95. return undefined;
  96. },
  97. _finalize : function( end ) {
  98. var lastMultiMaterial = this.currentMaterial();
  99. if ( lastMultiMaterial && lastMultiMaterial.groupEnd === -1 ) {
  100. lastMultiMaterial.groupEnd = this.geometry.vertices.length / 3;
  101. lastMultiMaterial.groupCount = lastMultiMaterial.groupEnd - lastMultiMaterial.groupStart;
  102. }
  103. // Guarantee at least one empty material, this makes the creation later more straight forward.
  104. if ( end !== false && this.materials.length === 0 ) {
  105. this.materials.push({
  106. name : '',
  107. smooth : this.smooth
  108. });
  109. }
  110. return lastMultiMaterial;
  111. }
  112. };
  113. this.objects.push( this.object );
  114. },
  115. finalize : function() {
  116. if ( this.object && typeof this.object._finalize === 'function' ) {
  117. this.object._finalize();
  118. }
  119. },
  120. parseVertexIndex: function ( value, len ) {
  121. var index = parseInt( value, 10 );
  122. return ( index >= 0 ? index - 1 : index + len / 3 ) * 3;
  123. },
  124. parseNormalIndex: function ( value, len ) {
  125. var index = parseInt( value, 10 );
  126. return ( index >= 0 ? index - 1 : index + len / 3 ) * 3;
  127. },
  128. parseUVIndex: function ( value, len ) {
  129. var index = parseInt( value, 10 );
  130. return ( index >= 0 ? index - 1 : index + len / 2 ) * 2;
  131. },
  132. addVertex: function ( a, b, c ) {
  133. var src = this.vertices;
  134. var dst = this.object.geometry.vertices;
  135. dst.push( src[ a + 0 ] );
  136. dst.push( src[ a + 1 ] );
  137. dst.push( src[ a + 2 ] );
  138. dst.push( src[ b + 0 ] );
  139. dst.push( src[ b + 1 ] );
  140. dst.push( src[ b + 2 ] );
  141. dst.push( src[ c + 0 ] );
  142. dst.push( src[ c + 1 ] );
  143. dst.push( src[ c + 2 ] );
  144. },
  145. addVertexLine: function ( a ) {
  146. var src = this.vertices;
  147. var dst = this.object.geometry.vertices;
  148. dst.push( src[ a + 0 ] );
  149. dst.push( src[ a + 1 ] );
  150. dst.push( src[ a + 2 ] );
  151. },
  152. addNormal : function ( a, b, c ) {
  153. var src = this.normals;
  154. var dst = this.object.geometry.normals;
  155. dst.push( src[ a + 0 ] );
  156. dst.push( src[ a + 1 ] );
  157. dst.push( src[ a + 2 ] );
  158. dst.push( src[ b + 0 ] );
  159. dst.push( src[ b + 1 ] );
  160. dst.push( src[ b + 2 ] );
  161. dst.push( src[ c + 0 ] );
  162. dst.push( src[ c + 1 ] );
  163. dst.push( src[ c + 2 ] );
  164. },
  165. addUV: function ( a, b, c ) {
  166. var src = this.uvs;
  167. var dst = this.object.geometry.uvs;
  168. dst.push( src[ a + 0 ] );
  169. dst.push( src[ a + 1 ] );
  170. dst.push( src[ b + 0 ] );
  171. dst.push( src[ b + 1 ] );
  172. dst.push( src[ c + 0 ] );
  173. dst.push( src[ c + 1 ] );
  174. },
  175. addUVLine: function ( a ) {
  176. var src = this.uvs;
  177. var dst = this.object.geometry.uvs;
  178. dst.push( src[ a + 0 ] );
  179. dst.push( src[ a + 1 ] );
  180. },
  181. addFace: function ( a, b, c, d, ua, ub, uc, ud, na, nb, nc, nd ) {
  182. var vLen = this.vertices.length;
  183. var ia = this.parseVertexIndex( a, vLen );
  184. var ib = this.parseVertexIndex( b, vLen );
  185. var ic = this.parseVertexIndex( c, vLen );
  186. var id;
  187. if ( d === undefined ) {
  188. this.addVertex( ia, ib, ic );
  189. } else {
  190. id = this.parseVertexIndex( d, vLen );
  191. this.addVertex( ia, ib, id );
  192. this.addVertex( ib, ic, id );
  193. }
  194. if ( ua !== undefined ) {
  195. var uvLen = this.uvs.length;
  196. ia = this.parseUVIndex( ua, uvLen );
  197. ib = this.parseUVIndex( ub, uvLen );
  198. ic = this.parseUVIndex( uc, uvLen );
  199. if ( d === undefined ) {
  200. this.addUV( ia, ib, ic );
  201. } else {
  202. id = this.parseUVIndex( ud, uvLen );
  203. this.addUV( ia, ib, id );
  204. this.addUV( ib, ic, id );
  205. }
  206. }
  207. if ( na !== undefined ) {
  208. // Normals are many times the same. If so, skip function call and parseInt.
  209. var nLen = this.normals.length;
  210. ia = this.parseNormalIndex( na, nLen );
  211. ib = na === nb ? ia : this.parseNormalIndex( nb, nLen );
  212. ic = na === nc ? ia : this.parseNormalIndex( nc, nLen );
  213. if ( d === undefined ) {
  214. this.addNormal( ia, ib, ic );
  215. } else {
  216. id = this.parseNormalIndex( nd, nLen );
  217. this.addNormal( ia, ib, id );
  218. this.addNormal( ib, ic, id );
  219. }
  220. }
  221. },
  222. addLineGeometry: function ( vertices, uvs ) {
  223. this.object.geometry.type = 'Line';
  224. var vLen = this.vertices.length;
  225. var uvLen = this.uvs.length;
  226. for ( var vi = 0, l = vertices.length; vi < l; vi ++ ) {
  227. this.addVertexLine( this.parseVertexIndex( vertices[ vi ], vLen ) );
  228. }
  229. for ( var uvi = 0, l = uvs.length; uvi < l; uvi ++ ) {
  230. this.addUVLine( this.parseUVIndex( uvs[ uvi ], uvLen ) );
  231. }
  232. }
  233. };
  234. state.startObject( '', false );
  235. return state;
  236. },
  237. parse: function ( text ) {
  238. console.time( 'OBJLoader' );
  239. var state = this._createParserState();
  240. if ( text.indexOf( '\r\n' ) !== - 1 ) {
  241. // This is faster than String.split with regex that splits on both
  242. text = text.replace( '\r\n', '\n' );
  243. }
  244. var lines = text.split( '\n' );
  245. var line = '', lineFirstChar = '', lineSecondChar = '';
  246. var lineLength = 0;
  247. var result = [];
  248. // Faster to just trim left side of the line. Use if available.
  249. var trimLeft = ( typeof ''.trimLeft === 'function' );
  250. for ( var i = 0, l = lines.length; i < l; i ++ ) {
  251. line = lines[ i ];
  252. line = trimLeft ? line.trimLeft() : line.trim();
  253. lineLength = line.length;
  254. if ( lineLength === 0 ) continue;
  255. lineFirstChar = line.charAt( 0 );
  256. // @todo invoke passed in handler if any
  257. if ( lineFirstChar === '#' ) continue;
  258. if ( lineFirstChar === 'v' ) {
  259. lineSecondChar = line.charAt( 1 );
  260. if ( lineSecondChar === ' ' && ( result = this.regexp.vertex_pattern.exec( line ) ) !== null ) {
  261. // 0 1 2 3
  262. // ["v 1.0 2.0 3.0", "1.0", "2.0", "3.0"]
  263. state.vertices.push(
  264. parseFloat( result[ 1 ] ),
  265. parseFloat( result[ 2 ] ),
  266. parseFloat( result[ 3 ] )
  267. );
  268. } else if ( lineSecondChar === 'n' && ( result = this.regexp.normal_pattern.exec( line ) ) !== null ) {
  269. // 0 1 2 3
  270. // ["vn 1.0 2.0 3.0", "1.0", "2.0", "3.0"]
  271. state.normals.push(
  272. parseFloat( result[ 1 ] ),
  273. parseFloat( result[ 2 ] ),
  274. parseFloat( result[ 3 ] )
  275. );
  276. } else if ( lineSecondChar === 't' && ( result = this.regexp.uv_pattern.exec( line ) ) !== null ) {
  277. // 0 1 2
  278. // ["vt 0.1 0.2", "0.1", "0.2"]
  279. state.uvs.push(
  280. parseFloat( result[ 1 ] ),
  281. parseFloat( result[ 2 ] )
  282. );
  283. } else {
  284. throw new Error( "Unexpected vertex/normal/uv line: '" + line + "'" );
  285. }
  286. } else if ( lineFirstChar === "f" ) {
  287. if ( ( result = this.regexp.face_vertex_uv_normal.exec( line ) ) !== null ) {
  288. // f vertex/uv/normal vertex/uv/normal vertex/uv/normal
  289. // 0 1 2 3 4 5 6 7 8 9 10 11 12
  290. // ["f 1/1/1 2/2/2 3/3/3", "1", "1", "1", "2", "2", "2", "3", "3", "3", undefined, undefined, undefined]
  291. state.addFace(
  292. result[ 1 ], result[ 4 ], result[ 7 ], result[ 10 ],
  293. result[ 2 ], result[ 5 ], result[ 8 ], result[ 11 ],
  294. result[ 3 ], result[ 6 ], result[ 9 ], result[ 12 ]
  295. );
  296. } else if ( ( result = this.regexp.face_vertex_uv.exec( line ) ) !== null ) {
  297. // f vertex/uv vertex/uv vertex/uv
  298. // 0 1 2 3 4 5 6 7 8
  299. // ["f 1/1 2/2 3/3", "1", "1", "2", "2", "3", "3", undefined, undefined]
  300. state.addFace(
  301. result[ 1 ], result[ 3 ], result[ 5 ], result[ 7 ],
  302. result[ 2 ], result[ 4 ], result[ 6 ], result[ 8 ]
  303. );
  304. } else if ( ( result = this.regexp.face_vertex_normal.exec( line ) ) !== null ) {
  305. // f vertex//normal vertex//normal vertex//normal
  306. // 0 1 2 3 4 5 6 7 8
  307. // ["f 1//1 2//2 3//3", "1", "1", "2", "2", "3", "3", undefined, undefined]
  308. state.addFace(
  309. result[ 1 ], result[ 3 ], result[ 5 ], result[ 7 ],
  310. undefined, undefined, undefined, undefined,
  311. result[ 2 ], result[ 4 ], result[ 6 ], result[ 8 ]
  312. );
  313. } else if ( ( result = this.regexp.face_vertex.exec( line ) ) !== null ) {
  314. // f vertex vertex vertex
  315. // 0 1 2 3 4
  316. // ["f 1 2 3", "1", "2", "3", undefined]
  317. state.addFace(
  318. result[ 1 ], result[ 2 ], result[ 3 ], result[ 4 ]
  319. );
  320. } else {
  321. throw new Error( "Unexpected face line: '" + line + "'" );
  322. }
  323. } else if ( lineFirstChar === "l" ) {
  324. var lineParts = line.substring( 1 ).trim().split( " " );
  325. var lineVertices = [], lineUVs = [];
  326. if ( line.indexOf( "/" ) === - 1 ) {
  327. lineVertices = lineParts;
  328. } else {
  329. for ( var li = 0, llen = lineParts.length; li < llen; li ++ ) {
  330. var parts = lineParts[ li ].split( "/" );
  331. if ( parts[ 0 ] !== "" ) lineVertices.push( parts[ 0 ] );
  332. if ( parts[ 1 ] !== "" ) lineUVs.push( parts[ 1 ] );
  333. }
  334. }
  335. state.addLineGeometry( lineVertices, lineUVs );
  336. } else if ( ( result = this.regexp.object_pattern.exec( line ) ) !== null ) {
  337. // o object_name
  338. // or
  339. // g group_name
  340. var name = result[ 0 ].substr( 1 ).trim();
  341. state.startObject( name );
  342. } else if ( this.regexp.material_use_pattern.test( line ) ) {
  343. // material
  344. state.object.startMaterial( line.substring( 7 ).trim(), state.materialLibraries );
  345. } else if ( this.regexp.material_library_pattern.test( line ) ) {
  346. // mtl file
  347. state.materialLibraries.push( line.substring( 7 ).trim() );
  348. } else if ( ( result = this.regexp.smoothing_pattern.exec( line ) ) !== null ) {
  349. // smooth shading
  350. // @todo Handle files that have varying smooth values for a set of faces inside one geometry,
  351. // but does not define a usemtl for each face set.
  352. // This should be detected and a dummy material created (later MultiMaterial and geometry groups).
  353. // This requires some care to not create extra material on each smooth value for "normal" obj files.
  354. // where explicit usemtl defines geometry groups.
  355. // Example asset: examples/models/obj/cerberus/Cerberus.obj
  356. var value = result[ 1 ].trim().toLowerCase();
  357. state.object.smooth = ( value === '1' || value === 'on' );
  358. var material = state.object.currentMaterial();
  359. if ( material ) {
  360. material.smooth = state.object.smooth;
  361. }
  362. } else {
  363. // Handle null terminated files without exception
  364. if ( line === '\0' ) continue;
  365. throw new Error( "Unexpected line: '" + line + "'" );
  366. }
  367. }
  368. state.finalize();
  369. var container = new THREE.Group();
  370. container.materialLibraries = [].concat( state.materialLibraries );
  371. for ( var i = 0, l = state.objects.length; i < l; i ++ ) {
  372. var object = state.objects[ i ];
  373. var geometry = object.geometry;
  374. var materials = object.materials;
  375. var isLine = ( geometry.type === 'Line' );
  376. // Skip o/g line declarations that did not follow with any faces
  377. if ( geometry.vertices.length === 0 ) continue;
  378. var buffergeometry = new THREE.BufferGeometry();
  379. buffergeometry.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( geometry.vertices ), 3 ) );
  380. if ( geometry.normals.length > 0 ) {
  381. buffergeometry.addAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( geometry.normals ), 3 ) );
  382. } else {
  383. buffergeometry.computeVertexNormals();
  384. }
  385. if ( geometry.uvs.length > 0 ) {
  386. buffergeometry.addAttribute( 'uv', new THREE.BufferAttribute( new Float32Array( geometry.uvs ), 2 ) );
  387. }
  388. // Create materials
  389. var createdMaterials = [];
  390. for ( var mi = 0, miLen = materials.length; mi < miLen ; mi++ ) {
  391. var sourceMaterial = materials[mi];
  392. var material = undefined;
  393. if ( this.materials !== null ) {
  394. material = this.materials.create( sourceMaterial.name );
  395. // mtl etc. loaders probably can't create line materials correctly, copy properties to a line material.
  396. if ( isLine && material && ! ( material instanceof THREE.LineBasicMaterial ) ) {
  397. var materialLine = new THREE.LineBasicMaterial();
  398. materialLine.copy( material );
  399. material = materialLine;
  400. }
  401. }
  402. if ( ! material ) {
  403. material = ( ! isLine ? new THREE.MeshPhongMaterial() : new THREE.LineBasicMaterial() );
  404. material.name = sourceMaterial.name;
  405. }
  406. material.shading = sourceMaterial.smooth ? THREE.SmoothShading : THREE.FlatShading;
  407. createdMaterials.push(material);
  408. }
  409. // Create mesh
  410. var mesh;
  411. if ( createdMaterials.length > 1 ) {
  412. for ( var mi = 0, miLen = materials.length; mi < miLen ; mi++ ) {
  413. var sourceMaterial = materials[mi];
  414. buffergeometry.addGroup( sourceMaterial.groupStart, sourceMaterial.groupCount, mi );
  415. }
  416. var multiMaterial = new THREE.MultiMaterial( createdMaterials );
  417. mesh = ( ! isLine ? new THREE.Mesh( buffergeometry, multiMaterial ) : new THREE.Line( buffergeometry, multiMaterial ) );
  418. } else {
  419. mesh = ( ! isLine ? new THREE.Mesh( buffergeometry, createdMaterials[ 0 ] ) : new THREE.Line( buffergeometry, createdMaterials[ 0 ] ) );
  420. }
  421. mesh.name = object.name;
  422. container.add( mesh );
  423. }
  424. console.timeEnd( 'OBJLoader' );
  425. return container;
  426. }
  427. };