RollerCoaster.js 13 KB

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