RollerCoaster.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430
  1. ( function () {
  2. class RollerCoasterGeometry extends THREE.BufferGeometry {
  3. constructor( curve, divisions ) {
  4. super();
  5. const vertices = [];
  6. const normals = [];
  7. const colors = [];
  8. const color1 = [ 1, 1, 1 ];
  9. const color2 = [ 1, 1, 0 ];
  10. const up = new THREE.Vector3( 0, 1, 0 );
  11. const forward = new THREE.Vector3();
  12. const right = new THREE.Vector3();
  13. const quaternion = new THREE.Quaternion();
  14. const prevQuaternion = new THREE.Quaternion();
  15. prevQuaternion.setFromAxisAngle( up, Math.PI / 2 );
  16. const point = new THREE.Vector3();
  17. const prevPoint = new THREE.Vector3();
  18. prevPoint.copy( curve.getPointAt( 0 ) );
  19. // shapes
  20. const step = [ new THREE.Vector3( - 0.225, 0, 0 ), new THREE.Vector3( 0, - 0.050, 0 ), new THREE.Vector3( 0, - 0.175, 0 ), new THREE.Vector3( 0, - 0.050, 0 ), new THREE.Vector3( 0.225, 0, 0 ), new THREE.Vector3( 0, - 0.175, 0 ) ];
  21. const PI2 = Math.PI * 2;
  22. let sides = 5;
  23. const tube1 = [];
  24. for ( let i = 0; i < sides; i ++ ) {
  25. const angle = i / sides * PI2;
  26. tube1.push( new THREE.Vector3( Math.sin( angle ) * 0.06, Math.cos( angle ) * 0.06, 0 ) );
  27. }
  28. sides = 6;
  29. const tube2 = [];
  30. for ( let i = 0; i < sides; i ++ ) {
  31. const angle = i / sides * PI2;
  32. tube2.push( new THREE.Vector3( Math.sin( angle ) * 0.025, Math.cos( angle ) * 0.025, 0 ) );
  33. }
  34. const vector = new THREE.Vector3();
  35. const normal = new THREE.Vector3();
  36. function drawShape( shape, color ) {
  37. normal.set( 0, 0, - 1 ).applyQuaternion( quaternion );
  38. for ( let j = 0; j < shape.length; j ++ ) {
  39. vector.copy( shape[ j ] );
  40. vector.applyQuaternion( quaternion );
  41. vector.add( point );
  42. vertices.push( vector.x, vector.y, vector.z );
  43. normals.push( normal.x, normal.y, normal.z );
  44. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  45. }
  46. normal.set( 0, 0, 1 ).applyQuaternion( quaternion );
  47. for ( let j = shape.length - 1; j >= 0; j -- ) {
  48. vector.copy( shape[ j ] );
  49. vector.applyQuaternion( quaternion );
  50. vector.add( point );
  51. vertices.push( vector.x, vector.y, vector.z );
  52. normals.push( normal.x, normal.y, normal.z );
  53. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  54. }
  55. }
  56. const vector1 = new THREE.Vector3();
  57. const vector2 = new THREE.Vector3();
  58. const vector3 = new THREE.Vector3();
  59. const vector4 = new THREE.Vector3();
  60. const normal1 = new THREE.Vector3();
  61. const normal2 = new THREE.Vector3();
  62. const normal3 = new THREE.Vector3();
  63. const normal4 = new THREE.Vector3();
  64. function extrudeShape( shape, offset, color ) {
  65. for ( let j = 0, jl = shape.length; j < jl; j ++ ) {
  66. const point1 = shape[ j ];
  67. const point2 = shape[ ( j + 1 ) % jl ];
  68. vector1.copy( point1 ).add( offset );
  69. vector1.applyQuaternion( quaternion );
  70. vector1.add( point );
  71. vector2.copy( point2 ).add( offset );
  72. vector2.applyQuaternion( quaternion );
  73. vector2.add( point );
  74. vector3.copy( point2 ).add( offset );
  75. vector3.applyQuaternion( prevQuaternion );
  76. vector3.add( prevPoint );
  77. vector4.copy( point1 ).add( offset );
  78. vector4.applyQuaternion( prevQuaternion );
  79. vector4.add( prevPoint );
  80. vertices.push( vector1.x, vector1.y, vector1.z );
  81. vertices.push( vector2.x, vector2.y, vector2.z );
  82. vertices.push( vector4.x, vector4.y, vector4.z );
  83. vertices.push( vector2.x, vector2.y, vector2.z );
  84. vertices.push( vector3.x, vector3.y, vector3.z );
  85. vertices.push( vector4.x, vector4.y, vector4.z );
  86. //
  87. normal1.copy( point1 );
  88. normal1.applyQuaternion( quaternion );
  89. normal1.normalize();
  90. normal2.copy( point2 );
  91. normal2.applyQuaternion( quaternion );
  92. normal2.normalize();
  93. normal3.copy( point2 );
  94. normal3.applyQuaternion( prevQuaternion );
  95. normal3.normalize();
  96. normal4.copy( point1 );
  97. normal4.applyQuaternion( prevQuaternion );
  98. normal4.normalize();
  99. normals.push( normal1.x, normal1.y, normal1.z );
  100. normals.push( normal2.x, normal2.y, normal2.z );
  101. normals.push( normal4.x, normal4.y, normal4.z );
  102. normals.push( normal2.x, normal2.y, normal2.z );
  103. normals.push( normal3.x, normal3.y, normal3.z );
  104. normals.push( normal4.x, normal4.y, normal4.z );
  105. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  106. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  107. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  108. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  109. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  110. colors.push( color[ 0 ], color[ 1 ], color[ 2 ] );
  111. }
  112. }
  113. const offset = new THREE.Vector3();
  114. for ( let i = 1; i <= divisions; i ++ ) {
  115. point.copy( curve.getPointAt( i / divisions ) );
  116. up.set( 0, 1, 0 );
  117. forward.subVectors( point, prevPoint ).normalize();
  118. right.crossVectors( up, forward ).normalize();
  119. up.crossVectors( forward, right );
  120. const angle = Math.atan2( forward.x, forward.z );
  121. quaternion.setFromAxisAngle( up, angle );
  122. if ( i % 2 === 0 ) {
  123. drawShape( step, color2 );
  124. }
  125. extrudeShape( tube1, offset.set( 0, - 0.125, 0 ), color2 );
  126. extrudeShape( tube2, offset.set( 0.2, 0, 0 ), color1 );
  127. extrudeShape( tube2, offset.set( - 0.2, 0, 0 ), color1 );
  128. prevPoint.copy( point );
  129. prevQuaternion.copy( quaternion );
  130. }
  131. // console.log( vertices.length );
  132. this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
  133. this.setAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
  134. this.setAttribute( 'color', new THREE.BufferAttribute( new Float32Array( colors ), 3 ) );
  135. }
  136. }
  137. class RollerCoasterLiftersGeometry extends THREE.BufferGeometry {
  138. constructor( curve, divisions ) {
  139. super();
  140. const vertices = [];
  141. const normals = [];
  142. const quaternion = new THREE.Quaternion();
  143. const up = new THREE.Vector3( 0, 1, 0 );
  144. const point = new THREE.Vector3();
  145. const tangent = new THREE.Vector3();
  146. // shapes
  147. const tube1 = [ new THREE.Vector3( 0, 0.05, - 0.05 ), new THREE.Vector3( 0, 0.05, 0.05 ), new THREE.Vector3( 0, - 0.05, 0 ) ];
  148. const tube2 = [ new THREE.Vector3( - 0.05, 0, 0.05 ), new THREE.Vector3( - 0.05, 0, - 0.05 ), new THREE.Vector3( 0.05, 0, 0 ) ];
  149. const tube3 = [ new THREE.Vector3( 0.05, 0, - 0.05 ), new THREE.Vector3( 0.05, 0, 0.05 ), new THREE.Vector3( - 0.05, 0, 0 ) ];
  150. const vector1 = new THREE.Vector3();
  151. const vector2 = new THREE.Vector3();
  152. const vector3 = new THREE.Vector3();
  153. const vector4 = new THREE.Vector3();
  154. const normal1 = new THREE.Vector3();
  155. const normal2 = new THREE.Vector3();
  156. const normal3 = new THREE.Vector3();
  157. const normal4 = new THREE.Vector3();
  158. function extrudeShape( shape, fromPoint, toPoint ) {
  159. for ( let j = 0, jl = shape.length; j < jl; j ++ ) {
  160. const point1 = shape[ j ];
  161. const point2 = shape[ ( j + 1 ) % jl ];
  162. vector1.copy( point1 );
  163. vector1.applyQuaternion( quaternion );
  164. vector1.add( fromPoint );
  165. vector2.copy( point2 );
  166. vector2.applyQuaternion( quaternion );
  167. vector2.add( fromPoint );
  168. vector3.copy( point2 );
  169. vector3.applyQuaternion( quaternion );
  170. vector3.add( toPoint );
  171. vector4.copy( point1 );
  172. vector4.applyQuaternion( quaternion );
  173. vector4.add( toPoint );
  174. vertices.push( vector1.x, vector1.y, vector1.z );
  175. vertices.push( vector2.x, vector2.y, vector2.z );
  176. vertices.push( vector4.x, vector4.y, vector4.z );
  177. vertices.push( vector2.x, vector2.y, vector2.z );
  178. vertices.push( vector3.x, vector3.y, vector3.z );
  179. vertices.push( vector4.x, vector4.y, vector4.z );
  180. //
  181. normal1.copy( point1 );
  182. normal1.applyQuaternion( quaternion );
  183. normal1.normalize();
  184. normal2.copy( point2 );
  185. normal2.applyQuaternion( quaternion );
  186. normal2.normalize();
  187. normal3.copy( point2 );
  188. normal3.applyQuaternion( quaternion );
  189. normal3.normalize();
  190. normal4.copy( point1 );
  191. normal4.applyQuaternion( quaternion );
  192. normal4.normalize();
  193. normals.push( normal1.x, normal1.y, normal1.z );
  194. normals.push( normal2.x, normal2.y, normal2.z );
  195. normals.push( normal4.x, normal4.y, normal4.z );
  196. normals.push( normal2.x, normal2.y, normal2.z );
  197. normals.push( normal3.x, normal3.y, normal3.z );
  198. normals.push( normal4.x, normal4.y, normal4.z );
  199. }
  200. }
  201. const fromPoint = new THREE.Vector3();
  202. const toPoint = new THREE.Vector3();
  203. for ( let i = 1; i <= divisions; i ++ ) {
  204. point.copy( curve.getPointAt( i / divisions ) );
  205. tangent.copy( curve.getTangentAt( i / divisions ) );
  206. const angle = Math.atan2( tangent.x, tangent.z );
  207. quaternion.setFromAxisAngle( up, angle );
  208. //
  209. if ( point.y > 10 ) {
  210. fromPoint.set( - 0.75, - 0.35, 0 );
  211. fromPoint.applyQuaternion( quaternion );
  212. fromPoint.add( point );
  213. toPoint.set( 0.75, - 0.35, 0 );
  214. toPoint.applyQuaternion( quaternion );
  215. toPoint.add( point );
  216. extrudeShape( tube1, fromPoint, toPoint );
  217. fromPoint.set( - 0.7, - 0.3, 0 );
  218. fromPoint.applyQuaternion( quaternion );
  219. fromPoint.add( point );
  220. toPoint.set( - 0.7, - point.y, 0 );
  221. toPoint.applyQuaternion( quaternion );
  222. toPoint.add( point );
  223. extrudeShape( tube2, fromPoint, toPoint );
  224. fromPoint.set( 0.7, - 0.3, 0 );
  225. fromPoint.applyQuaternion( quaternion );
  226. fromPoint.add( point );
  227. toPoint.set( 0.7, - point.y, 0 );
  228. toPoint.applyQuaternion( quaternion );
  229. toPoint.add( point );
  230. extrudeShape( tube3, fromPoint, toPoint );
  231. } else {
  232. fromPoint.set( 0, - 0.2, 0 );
  233. fromPoint.applyQuaternion( quaternion );
  234. fromPoint.add( point );
  235. toPoint.set( 0, - point.y, 0 );
  236. toPoint.applyQuaternion( quaternion );
  237. toPoint.add( point );
  238. extrudeShape( tube3, fromPoint, toPoint );
  239. }
  240. }
  241. this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
  242. this.setAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
  243. }
  244. }
  245. class RollerCoasterShadowGeometry extends THREE.BufferGeometry {
  246. constructor( curve, divisions ) {
  247. super();
  248. const vertices = [];
  249. const up = new THREE.Vector3( 0, 1, 0 );
  250. const forward = new THREE.Vector3();
  251. const quaternion = new THREE.Quaternion();
  252. const prevQuaternion = new THREE.Quaternion();
  253. prevQuaternion.setFromAxisAngle( up, Math.PI / 2 );
  254. const point = new THREE.Vector3();
  255. const prevPoint = new THREE.Vector3();
  256. prevPoint.copy( curve.getPointAt( 0 ) );
  257. prevPoint.y = 0;
  258. const vector1 = new THREE.Vector3();
  259. const vector2 = new THREE.Vector3();
  260. const vector3 = new THREE.Vector3();
  261. const vector4 = new THREE.Vector3();
  262. for ( let i = 1; i <= divisions; i ++ ) {
  263. point.copy( curve.getPointAt( i / divisions ) );
  264. point.y = 0;
  265. forward.subVectors( point, prevPoint );
  266. const angle = Math.atan2( forward.x, forward.z );
  267. quaternion.setFromAxisAngle( up, angle );
  268. vector1.set( - 0.3, 0, 0 );
  269. vector1.applyQuaternion( quaternion );
  270. vector1.add( point );
  271. vector2.set( 0.3, 0, 0 );
  272. vector2.applyQuaternion( quaternion );
  273. vector2.add( point );
  274. vector3.set( 0.3, 0, 0 );
  275. vector3.applyQuaternion( prevQuaternion );
  276. vector3.add( prevPoint );
  277. vector4.set( - 0.3, 0, 0 );
  278. vector4.applyQuaternion( prevQuaternion );
  279. vector4.add( prevPoint );
  280. vertices.push( vector1.x, vector1.y, vector1.z );
  281. vertices.push( vector2.x, vector2.y, vector2.z );
  282. vertices.push( vector4.x, vector4.y, vector4.z );
  283. vertices.push( vector2.x, vector2.y, vector2.z );
  284. vertices.push( vector3.x, vector3.y, vector3.z );
  285. vertices.push( vector4.x, vector4.y, vector4.z );
  286. prevPoint.copy( point );
  287. prevQuaternion.copy( quaternion );
  288. }
  289. this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
  290. }
  291. }
  292. class SkyGeometry extends THREE.BufferGeometry {
  293. constructor() {
  294. super();
  295. const vertices = [];
  296. for ( let i = 0; i < 100; i ++ ) {
  297. const x = Math.random() * 800 - 400;
  298. const y = Math.random() * 50 + 50;
  299. const z = Math.random() * 800 - 400;
  300. const size = Math.random() * 40 + 20;
  301. vertices.push( x - size, y, z - size );
  302. vertices.push( x + size, y, z - size );
  303. vertices.push( x - size, y, z + size );
  304. vertices.push( x + size, y, z - size );
  305. vertices.push( x + size, y, z + size );
  306. vertices.push( x - size, y, z + size );
  307. }
  308. this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
  309. }
  310. }
  311. class TreesGeometry extends THREE.BufferGeometry {
  312. constructor( landscape ) {
  313. super();
  314. const vertices = [];
  315. const colors = [];
  316. const raycaster = new THREE.Raycaster();
  317. raycaster.ray.direction.set( 0, - 1, 0 );
  318. for ( let i = 0; i < 2000; i ++ ) {
  319. const x = Math.random() * 500 - 250;
  320. const z = Math.random() * 500 - 250;
  321. raycaster.ray.origin.set( x, 50, z );
  322. const intersections = raycaster.intersectObject( landscape );
  323. if ( intersections.length === 0 ) continue;
  324. const y = intersections[ 0 ].point.y;
  325. const height = Math.random() * 5 + 0.5;
  326. let angle = Math.random() * Math.PI * 2;
  327. vertices.push( x + Math.sin( angle ), y, z + Math.cos( angle ) );
  328. vertices.push( x, y + height, z );
  329. vertices.push( x + Math.sin( angle + Math.PI ), y, z + Math.cos( angle + Math.PI ) );
  330. angle += Math.PI / 2;
  331. vertices.push( x + Math.sin( angle ), y, z + Math.cos( angle ) );
  332. vertices.push( x, y + height, z );
  333. vertices.push( x + Math.sin( angle + Math.PI ), y, z + Math.cos( angle + Math.PI ) );
  334. const random = Math.random() * 0.1;
  335. for ( let j = 0; j < 6; j ++ ) {
  336. colors.push( 0.2 + random, 0.4 + random, 0 );
  337. }
  338. }
  339. this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
  340. this.setAttribute( 'color', new THREE.BufferAttribute( new Float32Array( colors ), 3 ) );
  341. }
  342. }
  343. THREE.RollerCoasterGeometry = RollerCoasterGeometry;
  344. THREE.RollerCoasterLiftersGeometry = RollerCoasterLiftersGeometry;
  345. THREE.RollerCoasterShadowGeometry = RollerCoasterShadowGeometry;
  346. THREE.SkyGeometry = SkyGeometry;
  347. THREE.TreesGeometry = TreesGeometry;
  348. } )();