Real-Time Traffic Navigation Simulator

Live Demo: https://route-finder-ten.vercel.app/

Video:

Screen.Recording.2025-06-25.at.6.19.48.PM.mov

---

This project is a web-based traffic navigation simulator that visualizes how real-time traffic conditions affect route planning in a city. It provides an interactive map where users can find the fastest route between two points, taking into account dynamic traffic, road types, and vehicle constraints.

Key Features

• Interactive Map: A dynamic, SVG-based map displays a network of cities and roads.
• Real-Time Traffic: Traffic conditions are simulated on the backend and update automatically every few seconds.
• Smart Pathfinding: The simulator uses Dijkstra's algorithm to find the optimal route based on current travel times.
• Vehicle Constraints: The routing algorithm accounts for different vehicle types (e.g., trucks avoid narrow roads).
• Live Updates: Toggle on live updates to see the recommended route change automatically as traffic conditions fluctuate.
• Route Information: Displays the total estimated travel time and physical distance for the calculated path.

Technical Implementation

• Frontend: Built with Next.js (App Router) and React.
• UI: Styled with Tailwind CSS and uses ShadCN UI components.
• Backend: The graph data structure and traffic simulation logic are managed in-memory on the server-side using TypeScript.
• API: Next.js API routes handle requests for graph data, pathfinding, and traffic updates.
• Pathfinding: The core routing logic is powered by a custom implementation of Dijkstra's algorithm on a weighted graph.

Getting Started

To run this project locally:

1. Clone the repository

   git clone <repository-url>

2. Install dependencies

   npm install

3. Run the development server

   npm run dev

Open http://localhost:3000 in your browser to see the simulator in action.