A self-driving car simulation built from scratch with Vanilla JavaScript. This project uses a neural network and a genetic algorithm to teach a car how to navigate through dynamic traffic.
This project explores the concepts of neuroevolution by creating a simulated environment where a population of cars learns to drive autonomously. Each car is equipped with sensors and controlled by its own neural network "brain". Through a process modeled on natural selection, the cars evolve over generations to become better drivers. The entire simulation, from the physics to the neural network logic, is built with plain JavaScript, HTML, and CSS without any external libraries.
- Neural Network Brain: Each car is controlled by a feed-forward neural network.
- Genetic Algorithm: The cars learn and evolve using principles of selection, crossover, and mutation.
- Live Network Visualization: The brain of the best-performing car is visualized in real-time.
- Manual Driving Mode: Take the wheel yourself and see if you can beat the AI's best score!
- Unified High-Score System: The best score is tracked and saved, whether it was achieved by the AI or a human player.
- Dynamic Traffic Simulation: The AI must learn to navigate around other moving vehicles.
- Persistent Progress: The best-performing car's brain and the all-time high score are saved to the browser's Local Storage, allowing the training to be resumed later.
- Interactive Controls: Pause/resume the simulation, toggle a "fast mode" to accelerate training, and reset the simulation.
This project was built from the ground up using:
- HTML5
- CSS3
- JavaScript (ES6+)
- HTML5 Canvas API for all rendering and animation.
No external frameworks or libraries were used for the core simulation logic.
The AI is trained using a genetic algorithm:
- Fitness: A population of cars is generated. Each car drives until it crashes. Its "fitness" is determined by how far it traveled.
- Selection: The car with the highest fitness score from the generation is selected as the "best".
- Crossover & Mutation: A new generation of cars is created. Some are clones of the best car, while others are "offspring" created by mutating the best car's neural network. This mutation introduces small, random changes to the car's brain.
- Repeat: This cycle repeats, and over many generations, the random mutations that lead to better driving behavior are naturally selected for, resulting in progressively smarter cars.
To run this project on your local machine, follow these simple steps.
-
Clone the repository:
git clone https://github.com/relacosm/theLine.git
-
Navigate to the project directory:
cd theLine -
Open the
index.htmlfile: Since this is a static project, no build steps or installations are necessary. Simply open theindex.htmlfile in your web browser.Pro Tip: For best results, use a live server extension (like "Live Server" in VS Code) to avoid any potential browser CORS issues with local files.
This project is distributed under the MIT License. See LICENSE for more information.
This project was heavily inspired by the original self-driving car tutorial by gniziemazity. While building upon the foundational concepts, this version incorporates numerous custom features, bug fixes, and a unique UI.