SimplifyModifier.js 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503
  1. /**
  2. * @author zz85 / http://twitter.com/blurspline / http://www.lab4games.net/zz85/blog
  3. *
  4. * Simplification Geometry Modifier
  5. * - based on code and technique
  6. * - by Stan Melax in 1998
  7. * - Progressive Mesh type Polygon Reduction Algorithm
  8. * - http://www.melax.com/polychop/
  9. */
  10. import {
  11. BufferGeometry,
  12. Float32BufferAttribute,
  13. Geometry,
  14. Vector3
  15. } from "../../../build/three.module.js";
  16. var SimplifyModifier = function () {};
  17. ( function () {
  18. var cb = new Vector3(), ab = new Vector3();
  19. function pushIfUnique( array, object ) {
  20. if ( array.indexOf( object ) === - 1 ) array.push( object );
  21. }
  22. function removeFromArray( array, object ) {
  23. var k = array.indexOf( object );
  24. if ( k > - 1 ) array.splice( k, 1 );
  25. }
  26. function computeEdgeCollapseCost( u, v ) {
  27. // if we collapse edge uv by moving u to v then how
  28. // much different will the model change, i.e. the "error".
  29. var edgelength = v.position.distanceTo( u.position );
  30. var curvature = 0;
  31. var sideFaces = [];
  32. var i, il = u.faces.length, face, sideFace;
  33. // find the "sides" triangles that are on the edge uv
  34. for ( i = 0; i < il; i ++ ) {
  35. face = u.faces[ i ];
  36. if ( face.hasVertex( v ) ) {
  37. sideFaces.push( face );
  38. }
  39. }
  40. // use the triangle facing most away from the sides
  41. // to determine our curvature term
  42. for ( i = 0; i < il; i ++ ) {
  43. var minCurvature = 1;
  44. face = u.faces[ i ];
  45. for ( var j = 0; j < sideFaces.length; j ++ ) {
  46. sideFace = sideFaces[ j ];
  47. // use dot product of face normals.
  48. var dotProd = face.normal.dot( sideFace.normal );
  49. minCurvature = Math.min( minCurvature, ( 1.001 - dotProd ) / 2 );
  50. }
  51. curvature = Math.max( curvature, minCurvature );
  52. }
  53. // crude approach in attempt to preserve borders
  54. // though it seems not to be totally correct
  55. var borders = 0;
  56. if ( sideFaces.length < 2 ) {
  57. // we add some arbitrary cost for borders,
  58. // borders += 10;
  59. curvature = 1;
  60. }
  61. var amt = edgelength * curvature + borders;
  62. return amt;
  63. }
  64. function computeEdgeCostAtVertex( v ) {
  65. // compute the edge collapse cost for all edges that start
  66. // from vertex v. Since we are only interested in reducing
  67. // the object by selecting the min cost edge at each step, we
  68. // only cache the cost of the least cost edge at this vertex
  69. // (in member variable collapse) as well as the value of the
  70. // cost (in member variable collapseCost).
  71. if ( v.neighbors.length === 0 ) {
  72. // collapse if no neighbors.
  73. v.collapseNeighbor = null;
  74. v.collapseCost = - 0.01;
  75. return;
  76. }
  77. v.collapseCost = 100000;
  78. v.collapseNeighbor = null;
  79. // search all neighboring edges for "least cost" edge
  80. for ( var i = 0; i < v.neighbors.length; i ++ ) {
  81. var collapseCost = computeEdgeCollapseCost( v, v.neighbors[ i ] );
  82. if ( ! v.collapseNeighbor ) {
  83. v.collapseNeighbor = v.neighbors[ i ];
  84. v.collapseCost = collapseCost;
  85. v.minCost = collapseCost;
  86. v.totalCost = 0;
  87. v.costCount = 0;
  88. }
  89. v.costCount ++;
  90. v.totalCost += collapseCost;
  91. if ( collapseCost < v.minCost ) {
  92. v.collapseNeighbor = v.neighbors[ i ];
  93. v.minCost = collapseCost;
  94. }
  95. }
  96. // we average the cost of collapsing at this vertex
  97. v.collapseCost = v.totalCost / v.costCount;
  98. // v.collapseCost = v.minCost;
  99. }
  100. function removeVertex( v, vertices ) {
  101. console.assert( v.faces.length === 0 );
  102. while ( v.neighbors.length ) {
  103. var n = v.neighbors.pop();
  104. removeFromArray( n.neighbors, v );
  105. }
  106. removeFromArray( vertices, v );
  107. }
  108. function removeFace( f, faces ) {
  109. removeFromArray( faces, f );
  110. if ( f.v1 ) removeFromArray( f.v1.faces, f );
  111. if ( f.v2 ) removeFromArray( f.v2.faces, f );
  112. if ( f.v3 ) removeFromArray( f.v3.faces, f );
  113. // TODO optimize this!
  114. var vs = [ f.v1, f.v2, f.v3 ];
  115. var v1, v2;
  116. for ( var i = 0; i < 3; i ++ ) {
  117. v1 = vs[ i ];
  118. v2 = vs[ ( i + 1 ) % 3 ];
  119. if ( ! v1 || ! v2 ) continue;
  120. v1.removeIfNonNeighbor( v2 );
  121. v2.removeIfNonNeighbor( v1 );
  122. }
  123. }
  124. function collapse( vertices, faces, u, v ) { // u and v are pointers to vertices of an edge
  125. // Collapse the edge uv by moving vertex u onto v
  126. if ( ! v ) {
  127. // u is a vertex all by itself so just delete it..
  128. removeVertex( u, vertices );
  129. return;
  130. }
  131. var i;
  132. var tmpVertices = [];
  133. for ( i = 0; i < u.neighbors.length; i ++ ) {
  134. tmpVertices.push( u.neighbors[ i ] );
  135. }
  136. // delete triangles on edge uv:
  137. for ( i = u.faces.length - 1; i >= 0; i -- ) {
  138. if ( u.faces[ i ].hasVertex( v ) ) {
  139. removeFace( u.faces[ i ], faces );
  140. }
  141. }
  142. // update remaining triangles to have v instead of u
  143. for ( i = u.faces.length - 1; i >= 0; i -- ) {
  144. u.faces[ i ].replaceVertex( u, v );
  145. }
  146. removeVertex( u, vertices );
  147. // recompute the edge collapse costs in neighborhood
  148. for ( i = 0; i < tmpVertices.length; i ++ ) {
  149. computeEdgeCostAtVertex( tmpVertices[ i ] );
  150. }
  151. }
  152. function minimumCostEdge( vertices ) {
  153. // O(n * n) approach. TODO optimize this
  154. var least = vertices[ 0 ];
  155. for ( var i = 0; i < vertices.length; i ++ ) {
  156. if ( vertices[ i ].collapseCost < least.collapseCost ) {
  157. least = vertices[ i ];
  158. }
  159. }
  160. return least;
  161. }
  162. // we use a triangle class to represent structure of face slightly differently
  163. function Triangle( v1, v2, v3, a, b, c ) {
  164. this.a = a;
  165. this.b = b;
  166. this.c = c;
  167. this.v1 = v1;
  168. this.v2 = v2;
  169. this.v3 = v3;
  170. this.normal = new Vector3();
  171. this.computeNormal();
  172. v1.faces.push( this );
  173. v1.addUniqueNeighbor( v2 );
  174. v1.addUniqueNeighbor( v3 );
  175. v2.faces.push( this );
  176. v2.addUniqueNeighbor( v1 );
  177. v2.addUniqueNeighbor( v3 );
  178. v3.faces.push( this );
  179. v3.addUniqueNeighbor( v1 );
  180. v3.addUniqueNeighbor( v2 );
  181. }
  182. Triangle.prototype.computeNormal = function () {
  183. var vA = this.v1.position;
  184. var vB = this.v2.position;
  185. var vC = this.v3.position;
  186. cb.subVectors( vC, vB );
  187. ab.subVectors( vA, vB );
  188. cb.cross( ab ).normalize();
  189. this.normal.copy( cb );
  190. };
  191. Triangle.prototype.hasVertex = function ( v ) {
  192. return v === this.v1 || v === this.v2 || v === this.v3;
  193. };
  194. Triangle.prototype.replaceVertex = function ( oldv, newv ) {
  195. if ( oldv === this.v1 ) this.v1 = newv;
  196. else if ( oldv === this.v2 ) this.v2 = newv;
  197. else if ( oldv === this.v3 ) this.v3 = newv;
  198. removeFromArray( oldv.faces, this );
  199. newv.faces.push( this );
  200. oldv.removeIfNonNeighbor( this.v1 );
  201. this.v1.removeIfNonNeighbor( oldv );
  202. oldv.removeIfNonNeighbor( this.v2 );
  203. this.v2.removeIfNonNeighbor( oldv );
  204. oldv.removeIfNonNeighbor( this.v3 );
  205. this.v3.removeIfNonNeighbor( oldv );
  206. this.v1.addUniqueNeighbor( this.v2 );
  207. this.v1.addUniqueNeighbor( this.v3 );
  208. this.v2.addUniqueNeighbor( this.v1 );
  209. this.v2.addUniqueNeighbor( this.v3 );
  210. this.v3.addUniqueNeighbor( this.v1 );
  211. this.v3.addUniqueNeighbor( this.v2 );
  212. this.computeNormal();
  213. };
  214. function Vertex( v, id ) {
  215. this.position = v;
  216. this.id = id; // old index id
  217. this.faces = []; // faces vertex is connected
  218. this.neighbors = []; // neighbouring vertices aka "adjacentVertices"
  219. // these will be computed in computeEdgeCostAtVertex()
  220. this.collapseCost = 0; // cost of collapsing this vertex, the less the better. aka objdist
  221. this.collapseNeighbor = null; // best candinate for collapsing
  222. }
  223. Vertex.prototype.addUniqueNeighbor = function ( vertex ) {
  224. pushIfUnique( this.neighbors, vertex );
  225. };
  226. Vertex.prototype.removeIfNonNeighbor = function ( n ) {
  227. var neighbors = this.neighbors;
  228. var faces = this.faces;
  229. var offset = neighbors.indexOf( n );
  230. if ( offset === - 1 ) return;
  231. for ( var i = 0; i < faces.length; i ++ ) {
  232. if ( faces[ i ].hasVertex( n ) ) return;
  233. }
  234. neighbors.splice( offset, 1 );
  235. };
  236. SimplifyModifier.prototype.modify = function ( geometry, count ) {
  237. if ( geometry.isBufferGeometry ) {
  238. geometry = new Geometry().fromBufferGeometry( geometry );
  239. }
  240. geometry.mergeVertices();
  241. var oldVertices = geometry.vertices; // Three Position
  242. var oldFaces = geometry.faces; // Three Face
  243. // conversion
  244. var vertices = [];
  245. var faces = [];
  246. var i, il;
  247. //
  248. // put data of original geometry in different data structures
  249. //
  250. // add vertices
  251. for ( i = 0, il = oldVertices.length; i < il; i ++ ) {
  252. var vertex = new Vertex( oldVertices[ i ], i );
  253. vertices.push( vertex );
  254. }
  255. // add faces
  256. for ( i = 0, il = oldFaces.length; i < il; i ++ ) {
  257. var face = oldFaces[ i ];
  258. var a = face.a;
  259. var b = face.b;
  260. var c = face.c;
  261. var triangle = new Triangle( vertices[ a ], vertices[ b ], vertices[ c ], a, b, c );
  262. faces.push( triangle );
  263. }
  264. // compute all edge collapse costs
  265. for ( i = 0, il = vertices.length; i < il; i ++ ) {
  266. computeEdgeCostAtVertex( vertices[ i ] );
  267. }
  268. var nextVertex;
  269. var z = count;
  270. while ( z -- ) {
  271. nextVertex = minimumCostEdge( vertices );
  272. if ( ! nextVertex ) {
  273. console.log( 'THREE.SimplifyModifier: No next vertex' );
  274. break;
  275. }
  276. collapse( vertices, faces, nextVertex, nextVertex.collapseNeighbor );
  277. }
  278. //
  279. var simplifiedGeometry = new BufferGeometry();
  280. var position = [];
  281. var index = [];
  282. //
  283. for ( i = 0; i < vertices.length; i ++ ) {
  284. var vertex = vertices[ i ].position;
  285. position.push( vertex.x, vertex.y, vertex.z );
  286. }
  287. //
  288. for ( i = 0; i < faces.length; i ++ ) {
  289. var face = faces[ i ];
  290. var a = vertices.indexOf( face.v1 );
  291. var b = vertices.indexOf( face.v2 );
  292. var c = vertices.indexOf( face.v3 );
  293. index.push( a, b, c );
  294. }
  295. //
  296. simplifiedGeometry.setAttribute( 'position', new Float32BufferAttribute( position, 3 ) );
  297. simplifiedGeometry.setIndex( index );
  298. return simplifiedGeometry;
  299. };
  300. } )();
  301. export { SimplifyModifier };