An interactive web application to build, edit, and visualize graphs with support for the Dijkstra Algorithm, Critical Path Analysis, and Graph Matrices. Designed for learning, teaching, and experimenting with graph theory and pathfinding.
- 🧠 Visualize Dijkstra’s Algorithm (Shortest Path)
- 🟥 Visualize Critical Path (Longest Duration Path)
- 🔢 Generate and view Adjacency and Incidence Matrices
- 🧩 Full Graph Editing: Add/remove nodes and edges
- 🌀 Import/export graphs (JSON), export graph as PNG image
- 🎲 Generate random graphs
- 🔄 Modify graph elements with mouse interaction
- Add Node: Click "Add Node" and enter a name and duration.
- Delete Node: Click "Delete Node" and enter the node name.
- Add Edge: Click "Add Edge" and enter origin, destination, and cost. Choose if it should be bidirectional.
- Delete Edge: Click "Delete Edge" and enter origin and destination.
- Edit Node/Edge: Click on any node or edge to modify its label, duration (nodes), or cost (edges).
- Interaction: Move nodes with your mouse. Zoom using the scroll wheel.
- Add Random Graph: Click "Add Random Graph" and input the number of nodes.
- Delete All: Click "Delete All" to reset the graph.
- Dijkstra’s Algorithm: Click "Dijkstra Algorithm", select start and end nodes. The shortest path will be highlighted in green.
- Critical Path: Click "Critical Path", enter start and end nodes. The longest path will be highlighted in red.
- Export Graph: Download the current graph as a
.jsonfile. - Import Graph: Load a
.jsonfile to restore a saved graph. - Export Image: Save a PNG image of the current graph view.
- HTML5
- CSS3
- JavaScript (Cytoscape.js)
This project was designed to help users and students visualize how Dijkstra’s Algorithm works in real-time. It's a great tool for:
- Learning about graph traversal
- Understanding shortest path algorithms
- Exploring algorithmic efficiency
Developed by Josh Sebastián López Murcia