VRMLLoader.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.VRMLLoader = function () {};
  5. THREE.VRMLLoader.prototype = {
  6. constructor: THREE.VRMLLoader,
  7. load: function ( url, callback ) {
  8. var scope = this;
  9. var request = new XMLHttpRequest();
  10. request.addEventListener( 'load', function ( event ) {
  11. var object = scope.parse( event.target.responseText );
  12. scope.dispatchEvent( { type: 'load', content: object } );
  13. }, false );
  14. request.addEventListener( 'progress', function ( event ) {
  15. scope.dispatchEvent( { type: 'progress', loaded: event.loaded, total: event.total } );
  16. }, false );
  17. request.addEventListener( 'error', function () {
  18. scope.dispatchEvent( { type: 'error', message: 'Couldn\'t load URL [' + url + ']' } );
  19. }, false );
  20. request.open( 'GET', url, true );
  21. request.send( null );
  22. },
  23. parse: function ( data ) {
  24. var parseV1 = function ( lines, scene ) {
  25. console.warn( 'VRML V1.0 not supported yet' );
  26. };
  27. var parseV2 = function ( lines, scene ) {
  28. var getTree = function ( lines ) {
  29. var tree = { 'string': 'Scene', children: [] };
  30. var current = tree;
  31. var matches;
  32. for ( var i = 0; i < lines.length; i ++ ) {
  33. var comment = '';
  34. var line = lines[ i ];
  35. // omit whitespace only lines
  36. if ( null !== ( result = /^\s+?$/g.exec( line ) ) ) {
  37. continue;
  38. }
  39. if ( /#/.exec( line ) ) {
  40. var parts = line.split('#');
  41. // discard everything after the #, it is a comment
  42. line = parts[0];
  43. // well, let's also keep the comment
  44. comment = parts[1];
  45. }
  46. // todo: add collection like coordIndex and colorIndex who are delimited by [ ]
  47. if ( matches = /([^\s]*){1}\s?{/.exec( line ) ) { // first subpattern should match the Node name
  48. var block = { 'nodeType' : matches[1], 'string': line, 'parent': current, 'children': [],'comment' : comment };
  49. current.children.push( block );
  50. current = block;
  51. if ( /}/.exec( line ) ) {
  52. block.children.push( /{(.*)}/.exec( line )[ 1 ] );
  53. current = current.parent;
  54. }
  55. } else if ( /}/.exec( line ) ) {
  56. current = current.parent;
  57. } else if ( line !== '' ) {
  58. current.children.push( line );
  59. }
  60. }
  61. return tree;
  62. }
  63. var defines = {};
  64. var float_pattern = /\s+([\d|\.|\+|\-|e]+)/;
  65. var float3_pattern = /\s+([\d|\.|\+|\-|e]+),?\s+([\d|\.|\+|\-|e]+),?\s+([\d|\.|\+|\-|e]+)/;
  66. var float4_pattern = /\s+([\d|\.|\+|\-|e]+),?\s+([\d|\.|\+|\-|e]+),?\s+([\d|\.|\+|\-|e]+),?\s+([\d|\.|\+|\-|e]+)/;
  67. var parseNode = function ( data, parent ) {
  68. // console.log( data );
  69. if ( typeof data === 'string' ) {
  70. if ( /USE/.exec( data ) ) {
  71. var defineKey = /USE\s+?(\w+)/.exec( data )[ 1 ];
  72. if (undefined == defines[defineKey]) {
  73. debugger;
  74. console.warn(defineKey + ' is not defined.');
  75. } else {
  76. if ( /appearance/.exec( data ) && defineKey ) {
  77. parent.material = defines[ defineKey].clone();
  78. } else if ( /geometry/.exec( data ) && defineKey ) {
  79. parent.geometry = defines[ defineKey].clone();
  80. } else if (defineKey){
  81. var object = defines[ defineKey ].clone();
  82. parent.add( object );
  83. }
  84. }
  85. }
  86. return;
  87. }
  88. var object = parent;
  89. if ( /Transform/.exec( data.string ) || /Group/.exec( data.string ) ) {
  90. object = new THREE.Object3D();
  91. if ( /DEF/.exec( data.string ) ) {
  92. object.name = /DEF\s+(\w+)/.exec( data.string )[ 1 ];
  93. defines[ object.name ] = object;
  94. }
  95. for ( var i = 0, j = data.children.length; i < j; i ++ ) {
  96. var child = data.children[ i ];
  97. if ( /translation/.exec( child ) ) {
  98. var result = float3_pattern.exec( child );
  99. object.position.set(
  100. parseFloat( result[ 1 ] ),
  101. parseFloat( result[ 2 ] ),
  102. parseFloat( result[ 3 ] )
  103. );
  104. } else if ( /rotation/.exec( child ) ) {
  105. var result = float4_pattern.exec( child );
  106. var quaternion = new THREE.Quaternion();
  107. var x = parseFloat( result[ 1 ] );
  108. var y = parseFloat(result[ 2 ]);
  109. var z = parseFloat(result[ 3 ]);
  110. var w = parseFloat(result[ 4 ]);
  111. object.quaternion.setFromAxisAngle( new THREE.Vector3( x, y, z), w );
  112. } else if ( /scale/.exec( child ) ) {
  113. var result = float3_pattern.exec( child );
  114. object.scale.set(
  115. parseFloat( result[ 1 ] ),
  116. parseFloat( result[ 2 ] ),
  117. parseFloat( result[ 3 ] )
  118. );
  119. }
  120. }
  121. parent.add( object );
  122. } else if ( /Shape/.exec( data.string ) ) {
  123. object = new THREE.Mesh();
  124. if ( /DEF/.exec( data.string ) ) {
  125. object.name = /DEF (\w+)/.exec( data.string )[ 1 ];
  126. defines[ object.name ] = object;
  127. }
  128. parent.add( object );
  129. } else if ( /geometry/.exec( data.string ) ) {
  130. if ( /Box/.exec( data.string ) ) {
  131. var width = 1, height = 1, depth = 1;
  132. for ( var i = 0, j = data.children.length; i < j; i ++ ) {
  133. var child = data.children[ i ];
  134. if ( /size/.exec( child ) ) {
  135. var result = float3_pattern.exec( child );
  136. width = parseFloat( result[ 1 ] );
  137. height = parseFloat( result[ 2 ] );
  138. depth = parseFloat( result[ 3 ] );
  139. }
  140. }
  141. parent.geometry = new THREE.CubeGeometry( width, height, depth );
  142. } else if ( /Cylinder/.exec( data.string ) ) {
  143. var radius = 1, height = 1;
  144. for ( var i = 0, j = data.children.length; i < j; i ++ ) {
  145. var child = data.children[ i ];
  146. if ( /radius/.exec( child ) ) {
  147. radius = parseFloat( float_pattern.exec( child )[ 1 ] );
  148. } else if ( /height/.exec( child ) ) {
  149. height = parseFloat( float_pattern.exec( child )[ 1 ] );
  150. }
  151. }
  152. parent.geometry = new THREE.CylinderGeometry( radius, radius, height );
  153. } else if ( /Cone/.exec( data.string ) ) {
  154. var topRadius = 0, bottomRadius = 1, height = 1;
  155. for ( var i = 0, j = data.children.length; i < j; i ++ ) {
  156. var child = data.children[ i ];
  157. if ( /bottomRadius/.exec( child ) ) {
  158. bottomRadius = parseFloat( float_pattern.exec( child )[ 1 ] );
  159. } else if ( /height/.exec( child ) ) {
  160. height = parseFloat( float_pattern.exec( child )[ 1 ] );
  161. }
  162. }
  163. parent.geometry = new THREE.CylinderGeometry( topRadius, bottomRadius, height );
  164. } else if ( /Sphere/.exec( data.string ) ) {
  165. var result = /radius\s+([\d|\.|\+|\-|e]+)/.exec( data.children[ 0 ] );
  166. parent.geometry = new THREE.SphereGeometry( parseFloat( result[ 1 ] ) );
  167. } else if ( /IndexedFaceSet/.exec( data.string ) ) {
  168. var geometry = new THREE.Geometry();
  169. var isRecordingCoordinates = false;
  170. for (var i = 0, j = data.children.length; i < j; i++) {
  171. var child = data.children[i];
  172. var result;
  173. var vec;
  174. if ( /Coordinate/.exec (child.string)) {
  175. for (var k = 0, l = child.children.length; k < l; k++) {
  176. var point = child.children[k];
  177. if (null != (result = float3_pattern.exec(point))) {
  178. vec = new THREE.Vector3(
  179. parseFloat(result[1]),
  180. parseFloat(result[2]),
  181. parseFloat(result[3])
  182. );
  183. geometry.vertices.push( vec );
  184. }
  185. }
  186. }
  187. if (/coordIndex/.exec(child)) {
  188. isRecordingCoordinates = true;
  189. }
  190. var coordIndex = false;
  191. var face3 = [];
  192. var skip = 0;
  193. var regex = /(-?\d+)/g;
  194. while ( isRecordingCoordinates && null != (coordIndex = regex.exec(child) ) ) {
  195. // parse coordIndex lines
  196. coordIndex = parseInt(coordIndex, 10);
  197. face3.push(coordIndex);
  198. // -1 indicates end of face points
  199. if (coordIndex === -1) {
  200. // reset the collection
  201. face3 = [];
  202. }
  203. // vrml support multipoint indexed face sets (more then 3 vertices). You must calculate the composing triangles here
  204. skip = face3.length -3;
  205. skip = skip < 0 ? 0 : skip;
  206. // Face3 only works with triangles, but IndexedFaceSet allows others shapes, build them of triangles
  207. if (face3.length >= 3) {
  208. var face = new THREE.Face3(
  209. face3[0],
  210. face3[skip + 1],
  211. face3[skip + 2]
  212. // todo: pass in the normal here, if any, or set it (better)
  213. // todo: pass in the color
  214. );
  215. // calculate normal
  216. var v1 = new THREE.Vector3();
  217. var v2 = new THREE.Vector3();
  218. var vertex0 = geometry.vertices[face3[0]];
  219. var vertex1 = geometry.vertices[face3[1]];
  220. var vertex2 = geometry.vertices[face3[2]];
  221. if (undefined == vertex0 || undefined == vertex1 || undefined == vertex2) {
  222. // skip this face
  223. } else {
  224. // add this face
  225. v1.subVectors(vertex1, vertex0);
  226. v2.subVectors(vertex2, vertex0);
  227. var normal = new THREE.Vector3();
  228. normal = normal.crossVectors(v1, v2);
  229. face.normal.copy( normal );
  230. face.vertexNormals.push( normal.clone(), normal.clone(), normal.clone() );
  231. geometry.faces.push(face);
  232. }
  233. }
  234. }
  235. // stop recording if a ] is encountered after recording was turned on
  236. isRecordingCoordinates = (isRecordingCoordinates && null === (/]/.exec(child) ) );
  237. }
  238. geometry.computeBoundingSphere();
  239. // see if it's a define
  240. if ( /DEF/.exec( data.string ) ) {
  241. geometry.name = /DEF (\w+)/.exec( data.string )[ 1 ];
  242. defines[ geometry.name ] = geometry;
  243. }
  244. parent.geometry = geometry;
  245. }
  246. return;
  247. } else if ( /appearance/.exec( data.string ) ) {
  248. for ( var i = 0; i < data.children.length; i ++ ) {
  249. var child = data.children[ i ];
  250. if ( /Material/.exec( child.string ) ) {
  251. var material = new THREE.MeshPhongMaterial();
  252. for ( var j = 0; j < child.children.length; j ++ ) {
  253. var parameter = child.children[ j ];
  254. if ( /diffuseColor/.exec( parameter ) ) {
  255. var result = float3_pattern.exec( parameter );
  256. material.color.setRGB(
  257. parseFloat( result[ 1 ] ),
  258. parseFloat( result[ 2 ] ),
  259. parseFloat( result[ 3 ] )
  260. );
  261. } else if ( /emissiveColor/.exec( parameter ) ) {
  262. var result = float3_pattern.exec( parameter );
  263. material.emissive.setRGB(
  264. parseFloat( result[ 1 ] ),
  265. parseFloat( result[ 2 ] ),
  266. parseFloat( result[ 3 ] )
  267. );
  268. } else if ( /specularColor/.exec( parameter ) ) {
  269. var result = float3_pattern.exec( parameter );
  270. material.specular.setRGB(
  271. parseFloat( result[ 1 ] ),
  272. parseFloat( result[ 2 ] ),
  273. parseFloat( result[ 3 ] )
  274. );
  275. } else if ( /transparency/.exec( parameter ) ) {
  276. var result = /\s+([\d|\.|\+|\-|e]+)/.exec( parameter );
  277. // transparency is opposite of opacity
  278. material.opacity = Math.abs( 1 - parseFloat( result[ 1 ] ) );
  279. material.transparent = true;
  280. }
  281. }
  282. if ( /DEF/.exec( data.string ) ) {
  283. material.name = /DEF (\w+)/.exec( data.string )[ 1 ];
  284. defines[ material.name ] = material;
  285. }
  286. parent.material = material;
  287. }
  288. }
  289. return;
  290. }
  291. for ( var i = 0, l = data.children.length; i < l; i ++ ) {
  292. var child = data.children[ i ];
  293. parseNode( data.children[ i ], object );
  294. }
  295. }
  296. parseNode( getTree( lines ), scene );
  297. };
  298. var scene = new THREE.Scene();
  299. var lines = data.split( '\n' );
  300. var header = lines.shift();
  301. if ( /V1.0/.exec( header ) ) {
  302. parseV1( lines, scene );
  303. } else if ( /V2.0/.exec( header ) ) {
  304. parseV2( lines, scene );
  305. }
  306. return scene;
  307. }
  308. };
  309. THREE.EventDispatcher.prototype.apply( THREE.VRMLLoader.prototype );