Dynagraph is a dynamic graph visualization tool built with Cytoscape and React. This interactive platform allows users to manage nodes, edit edge weights, toggle draw modes, and visualize optimal paths using Dijkstra's algorithm.
- Graph Editing: Easily add, remove, and manage nodes and edges.
- Edge Weight Modification: Double-click edges to modify their weights.
- Draw Mode: Enable/disable draw mode by holding and releasing the right-click button.
- Optimal Path Visualization: Utilize Dijkstra's algorithm to highlight optimal paths.
- Interactive Controls: Double-click to remove nodes and edges.
- Node Selection: Click once to select a start node, twice to set it as a stop node.
- Stop Node Removal: Click thrice to remove the stop node property.
- Clone the repository.
- Run
npm installto install dependencies. - Launch the application with
npm start.
- Adding Nodes: Click "Add Node" to create new nodes.
- Edge Editing: Double-click on edges to modify their weights.
- Draw Mode: Hold right-click to enable dynamic edge creation. Release to disable.
- Optimal Path: Select start and stop nodes to visualize the optimal path.
- Removing Elements: Double-click nodes or edges to remove them interactively.
- Node Selection: Click once on a node to set it as the start node, twice to set it as the stop node.
- Stop Node Removal: Click thrice on a pre-selected stop node to remove the stop node property.
- React
- Cytoscape
- Dijkstra's Algorithm
- Visit the Dynagraph GitHub Page for live demo.
- This project utilizes Cytoscape and React libraries.
- Inspired by graph theory and visualization techniques.
This project is licensed under the MIT License.