Algs Visualizer

A web app used for educational purposes to currently display the efficiency of different path finding algorithms with future plans to make this a one-stop-shop to learn all forms of algorithms.

A Note On Contributions:

Contributions are closed right now due to this being a personal project. However during production I might be inclined to add more users to the project

Built With:

Frontend Tech

  • ReactJS
  • TypescriptJS
  • TailwindCSS
  • Mapbox API

Backend tech

  • NextJS (app Directory)
  • Open Street Maps

Infra

  • Vercel

Current and Future Additions (Stage 1 - Scaffolding):

  • Mapbox integration
  • URL state management
  • Breadth First Search added
  • Depth First Search added
  • A*
  • Djikstra's
  • OSM Data parser (currently broken) ~~ - [x] Ability for users to select an origin and destination ~~ ~~ - [x] Moving onto stage 3~~

Future Additions (Stage 2 - Explaners)

  • Info page for each algorithm
    • Quick explanation
    • Add visualizations (stacked 3D visuals would be cool)
    • Small graphic for time and space complexity
    • Video for each algorithm (Manim/Motion Canvas)
  • Quick info page for all algorithms (only show space and time complexity)

Future Additions (Stage 3 - Expansion)

  • Include more pathfinding algs
  • Look into other forms of algs (evolutionary algs)

Future Additions (Stage 4 - Real World)

  • Add links to most popular papers with the algorithms
    • Paper using the algorithm
    • Paper explaining/expanding the algorithm
  • Add real world data to these algorithms as a playground

Changes and optimizations needed

  • Fix typings in visualizer page
  • Change colors for DeckGL layers

Bugs to fix

  • OSM Data Parser

Built by Juan Ramirez