GraphAV - A graph algorithms visualizer built using React and Typescript
Karim Elghamry
Posted on July 28, 2020
Aim of the project
GraphAV is an open source graph algorithms visualizer built 💯 from scratch using React and Typescript. It strives to facilitate the learning process of anyone who's struggling to grasp the concept of a certain graph algorithm. It can also be used as a tool by teachers to easily introduce a new algorithm to their students 👨🎓👩🎓.
links
website: https://karimelghamry.github.io/GraphAV/
Github repo: https://github.com/KarimElghamry/GraphAV
GraphAV does not include any UI dependencies in its code other than styled-components. 🎉🎉
NOTE: touch screen support is yet to be implemented. Use a PC/Laptop for a better experience.
Show some ❤️ and ⭐ the repo to support the project 😁
Features
✔️ Light/Dark themes
✔️ Add, move and delete nodes
✔️ Directed/Undirected edges
✔️ Unweighted edges
✔️ Control visualization speed
✔️ Control canvas zoom percentage
✔️ Shortest paths and predecessor node information
✔️ Visited nodes/edges animations
🚧 Weighted edges (to be implemented)
🚧 Touch screen support (to be implemented)
🚧 Save/share graphs (to be implemented)
Available Algorithms
✔️ DFS - Depth First Search
✔️ DLS - Depth Limited Search
✔️ IDDFS - Iterative Deepening Depth First Search
✔️ BFS - Breadth First Search (with shortest paths calculations)
✔️ Dijkstra (with shortest paths calculations)
🚧 Bellman-Ford (to be implemented)
🚧 Floyd-Warshall (to be implemented)
🚧 A* (to be implemented)
🚧 Kosaraju (to be implemented)
🚧 Tarjan's Strongly Connected Components* (to be implemented)
Demo
Posted on July 28, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.