SubdivisionModifier.js 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389
  1. /*
  2. * @author zz85 / http://twitter.com/blurspline / http://www.lab4games.net/zz85/blog
  3. * @author centerionware / http://www.centerionware.com
  4. *
  5. * Subdivision Geometry Modifier
  6. * using Loop Subdivision Scheme
  7. *
  8. * References:
  9. * http://graphics.stanford.edu/~mdfisher/subdivision.html
  10. * http://www.holmes3d.net/graphics/subdivision/
  11. * http://www.cs.rutgers.edu/~decarlo/readings/subdiv-sg00c.pdf
  12. *
  13. * Known Issues:
  14. * - currently doesn't handle "Sharp Edges"
  15. */
  16. THREE.SubdivisionModifier = function ( subdivisions ) {
  17. this.subdivisions = ( subdivisions === undefined ) ? 1 : subdivisions;
  18. };
  19. // Applies the "modify" pattern
  20. THREE.SubdivisionModifier.prototype.modify = function ( geometry ) {
  21. var repeats = this.subdivisions;
  22. while ( repeats -- > 0 ) {
  23. this.smooth( geometry );
  24. }
  25. delete geometry.__tmpVertices;
  26. geometry.computeFaceNormals();
  27. geometry.computeVertexNormals();
  28. };
  29. ( function() {
  30. // Some constants
  31. var WARNINGS = ! true; // Set to true for development
  32. var ABC = [ 'a', 'b', 'c' ];
  33. function getEdge( a, b, map ) {
  34. var vertexIndexA = Math.min( a, b );
  35. var vertexIndexB = Math.max( a, b );
  36. var key = vertexIndexA + "_" + vertexIndexB;
  37. return map[ key ];
  38. }
  39. function processEdge( a, b, vertices, map, face, metaVertices ) {
  40. var vertexIndexA = Math.min( a, b );
  41. var vertexIndexB = Math.max( a, b );
  42. var key = vertexIndexA + "_" + vertexIndexB;
  43. var edge;
  44. if ( key in map ) {
  45. edge = map[ key ];
  46. } else {
  47. var vertexA = vertices[ vertexIndexA ];
  48. var vertexB = vertices[ vertexIndexB ];
  49. edge = {
  50. a: vertexA, // pointer reference
  51. b: vertexB,
  52. newEdge: null,
  53. // aIndex: a, // numbered reference
  54. // bIndex: b,
  55. faces: [] // pointers to face
  56. };
  57. map[ key ] = edge;
  58. }
  59. edge.faces.push( face );
  60. metaVertices[ a ].edges.push( edge );
  61. metaVertices[ b ].edges.push( edge );
  62. }
  63. function generateLookups( vertices, faces, metaVertices, edges ) {
  64. var i, il, face, edge;
  65. for ( i = 0, il = vertices.length; i < il; i ++ ) {
  66. metaVertices[ i ] = { edges: [] };
  67. }
  68. for ( i = 0, il = faces.length; i < il; i ++ ) {
  69. face = faces[ i ];
  70. processEdge( face.a, face.b, vertices, edges, face, metaVertices );
  71. processEdge( face.b, face.c, vertices, edges, face, metaVertices );
  72. processEdge( face.c, face.a, vertices, edges, face, metaVertices );
  73. }
  74. }
  75. function newFace( newFaces, a, b, c ) {
  76. newFaces.push( new THREE.Face3( a, b, c ) );
  77. }
  78. function midpoint( a, b ) {
  79. return ( Math.abs( b - a ) / 2 ) + Math.min( a, b );
  80. }
  81. function newUv( newUvs, a, b, c ) {
  82. newUvs.push( [ a.clone(), b.clone(), c.clone() ] );
  83. }
  84. /////////////////////////////
  85. // Performs one iteration of Subdivision
  86. THREE.SubdivisionModifier.prototype.smooth = function ( geometry ) {
  87. var tmp = new THREE.Vector3();
  88. var oldVertices, oldFaces, oldUvs;
  89. var newVertices, newFaces, newUVs = [];
  90. var n, l, i, il, j, k;
  91. var metaVertices, sourceEdges;
  92. // new stuff.
  93. var sourceEdges, newEdgeVertices, newSourceVertices;
  94. oldVertices = geometry.vertices; // { x, y, z}
  95. oldFaces = geometry.faces; // { a: oldVertex1, b: oldVertex2, c: oldVertex3 }
  96. oldUvs = geometry.faceVertexUvs[ 0 ];
  97. var hasUvs = oldUvs !== undefined && oldUvs.length > 0;
  98. /******************************************************
  99. *
  100. * Step 0: Preprocess Geometry to Generate edges Lookup
  101. *
  102. *******************************************************/
  103. metaVertices = new Array( oldVertices.length );
  104. sourceEdges = {}; // Edge => { oldVertex1, oldVertex2, faces[] }
  105. generateLookups( oldVertices, oldFaces, metaVertices, sourceEdges );
  106. /******************************************************
  107. *
  108. * Step 1.
  109. * For each edge, create a new Edge Vertex,
  110. * then position it.
  111. *
  112. *******************************************************/
  113. newEdgeVertices = [];
  114. var other, currentEdge, newEdge, face;
  115. var edgeVertexWeight, adjacentVertexWeight, connectedFaces;
  116. for ( i in sourceEdges ) {
  117. currentEdge = sourceEdges[ i ];
  118. newEdge = new THREE.Vector3();
  119. edgeVertexWeight = 3 / 8;
  120. adjacentVertexWeight = 1 / 8;
  121. connectedFaces = currentEdge.faces.length;
  122. // check how many linked faces. 2 should be correct.
  123. if ( connectedFaces != 2 ) {
  124. // if length is not 2, handle condition
  125. edgeVertexWeight = 0.5;
  126. adjacentVertexWeight = 0;
  127. if ( connectedFaces != 1 ) {
  128. if ( WARNINGS ) console.warn( 'Subdivision Modifier: Number of connected faces != 2, is: ', connectedFaces, currentEdge );
  129. }
  130. }
  131. newEdge.addVectors( currentEdge.a, currentEdge.b ).multiplyScalar( edgeVertexWeight );
  132. tmp.set( 0, 0, 0 );
  133. for ( j = 0; j < connectedFaces; j ++ ) {
  134. face = currentEdge.faces[ j ];
  135. for ( k = 0; k < 3; k ++ ) {
  136. other = oldVertices[ face[ ABC[ k ] ] ];
  137. if ( other !== currentEdge.a && other !== currentEdge.b ) break;
  138. }
  139. tmp.add( other );
  140. }
  141. tmp.multiplyScalar( adjacentVertexWeight );
  142. newEdge.add( tmp );
  143. currentEdge.newEdge = newEdgeVertices.length;
  144. newEdgeVertices.push( newEdge );
  145. // console.log(currentEdge, newEdge);
  146. }
  147. /******************************************************
  148. *
  149. * Step 2.
  150. * Reposition each source vertices.
  151. *
  152. *******************************************************/
  153. var beta, sourceVertexWeight, connectingVertexWeight;
  154. var connectingEdge, connectingEdges, oldVertex, newSourceVertex;
  155. newSourceVertices = [];
  156. for ( i = 0, il = oldVertices.length; i < il; i ++ ) {
  157. oldVertex = oldVertices[ i ];
  158. // find all connecting edges (using lookupTable)
  159. connectingEdges = metaVertices[ i ].edges;
  160. n = connectingEdges.length;
  161. if ( n == 3 ) {
  162. beta = 3 / 16;
  163. } else if ( n > 3 ) {
  164. beta = 3 / ( 8 * n ); // Warren's modified formula
  165. }
  166. // Loop's original beta formula
  167. // beta = 1 / n * ( 5/8 - Math.pow( 3/8 + 1/4 * Math.cos( 2 * Math. PI / n ), 2) );
  168. sourceVertexWeight = 1 - n * beta;
  169. connectingVertexWeight = beta;
  170. if ( n <= 2 ) {
  171. // crease and boundary rules
  172. // console.warn('crease and boundary rules');
  173. if ( n == 2 ) {
  174. if ( WARNINGS ) console.warn( '2 connecting edges', connectingEdges );
  175. sourceVertexWeight = 3 / 4;
  176. connectingVertexWeight = 1 / 8;
  177. // sourceVertexWeight = 1;
  178. // connectingVertexWeight = 0;
  179. } else if ( n == 1 ) {
  180. if ( WARNINGS ) console.warn( 'only 1 connecting edge' );
  181. } else if ( n == 0 ) {
  182. if ( WARNINGS ) console.warn( '0 connecting edges' );
  183. }
  184. }
  185. newSourceVertex = oldVertex.clone().multiplyScalar( sourceVertexWeight );
  186. tmp.set( 0, 0, 0 );
  187. for ( j = 0; j < n; j ++ ) {
  188. connectingEdge = connectingEdges[ j ];
  189. other = connectingEdge.a !== oldVertex ? connectingEdge.a : connectingEdge.b;
  190. tmp.add( other );
  191. }
  192. tmp.multiplyScalar( connectingVertexWeight );
  193. newSourceVertex.add( tmp );
  194. newSourceVertices.push( newSourceVertex );
  195. }
  196. /******************************************************
  197. *
  198. * Step 3.
  199. * Generate Faces between source vertices
  200. * and edge vertices.
  201. *
  202. *******************************************************/
  203. newVertices = newSourceVertices.concat( newEdgeVertices );
  204. var sl = newSourceVertices.length, edge1, edge2, edge3;
  205. newFaces = [];
  206. var uv, x0, x1, x2;
  207. var x3 = new THREE.Vector2();
  208. var x4 = new THREE.Vector2();
  209. var x5 = new THREE.Vector2();
  210. for ( i = 0, il = oldFaces.length; i < il; i ++ ) {
  211. face = oldFaces[ i ];
  212. // find the 3 new edges vertex of each old face
  213. edge1 = getEdge( face.a, face.b, sourceEdges ).newEdge + sl;
  214. edge2 = getEdge( face.b, face.c, sourceEdges ).newEdge + sl;
  215. edge3 = getEdge( face.c, face.a, sourceEdges ).newEdge + sl;
  216. // create 4 faces.
  217. newFace( newFaces, edge1, edge2, edge3 );
  218. newFace( newFaces, face.a, edge1, edge3 );
  219. newFace( newFaces, face.b, edge2, edge1 );
  220. newFace( newFaces, face.c, edge3, edge2 );
  221. // create 4 new uv's
  222. if ( hasUvs ) {
  223. uv = oldUvs[ i ];
  224. x0 = uv[ 0 ];
  225. x1 = uv[ 1 ];
  226. x2 = uv[ 2 ];
  227. x3.set( midpoint( x0.x, x1.x ), midpoint( x0.y, x1.y ) );
  228. x4.set( midpoint( x1.x, x2.x ), midpoint( x1.y, x2.y ) );
  229. x5.set( midpoint( x0.x, x2.x ), midpoint( x0.y, x2.y ) );
  230. newUv( newUVs, x3, x4, x5 );
  231. newUv( newUVs, x0, x3, x5 );
  232. newUv( newUVs, x1, x4, x3 );
  233. newUv( newUVs, x2, x5, x4 );
  234. }
  235. }
  236. // Overwrite old arrays
  237. geometry.vertices = newVertices;
  238. geometry.faces = newFaces;
  239. if ( hasUvs ) geometry.faceVertexUvs[ 0 ] = newUVs;
  240. // console.log('done');
  241. };
  242. } )();