Improvement of the threeJS script

Job Description:

See doc from attach


Use [login to view URL],

[login to view URL]

Example [login to view URL]

Needs to be improved:

1. roadMesh should not be a plane, but a 3D object with textures. (I will provide the model). The track is defined in the example image through curvePoints coordinates and should look like a track with 5 grooves

2. Initially, the camera is fixed at the starting point.

3. Adding a player. Enter the name and select the machine (there will be 6 models of machines, I will provide)

4. The car is displayed on the track. Track troughs are filled in order of priority. When a player is added, a color is automatically assigned to it. The player's color indicator (hairpin) is displayed above the typewriter

The machine you choose depends on:

1.1. The model that is displayed on the track

5. After 5 players have been added, the start button becomes active, when pressed, the entire racing process starts. (the int parameter indicating the ID of the main car is passed to the start function) The main car is distinguished among others by the beech "i" above the hairpin.

6. The maxLaps variable sets the number of laps to the finish line. When this value is reached, the machine stops.

7. Track length is set in const ls = 1400; // length segments - the number of points on the track that the car needs to overcome to complete one circle.

8. Driving() - a function for redefining the positions of cars, is called constantly, cyclically until all cars finish.

9. Global Race Step (GSHP) - each Driving() call

10. Car Step (CWM) - the number of points that the car overcomes in one GSHG (in the example it changes randomly every 200 CMM of one or another car), roughly speaking the speed of the car.

11. Trap - 3D object appearing on the track (I will provide the model)

12. Trap effect - 3D animation at a certain point in the track


1. Check-in script - an array containing actions in a specific GSHG. The array contains:

1.1. GSHG number

1.2. CMM of each machine


1.3. Installing a trap (trap coordinates (number from 0 to ls), trap id)

1.4. Removing a trap (trap id)

1.5. Trap effect (effect coordinates (a number from 0 to ls))

This is just for sample script data. The structure of this array can be changed for optimization. The scenario does not contain all steps, only steps with actions. There are no parameter changes between the steps specified in the script.

3. During the race, we display the current top in the RACE block:

1. Participant name *lap* *total time*

4. At the end of the race, we display the top participants, the total time and the time of each lap in the console.

5. After reaching all the finish cars, the camera is positioned in the same way as before the start, but does not look at the cars from behind, but from the front.

6. Camera:

1. Initial position before the start (looks at the cars from behind)

2. The beginning of the race (after the stratum) is an oblique projection covering the entire track.


My All View - general plan with tracking of the main machine

My Follow View - the camera flies behind the car

The buttons in front of the players work in the same way, only the car that the camera is watching is switched

No interfaces are needed, all controls are as in the example.

Beceriler: JavaScript, OpenGL, Three.js, React.js, Oyun Tasarımı

Müşteri Hakkında:
( 0 değerlendirme ) Kiev, Ukraine

Proje NO: #35440087