A lightweight, browser-based graph visualizer designed to help students and developers visualize graphs and practice graph algorithms. Perfect for algorithm studies and note-taking in tools like Obsidian.
- Simple Input Format: Input graphs using the format
A-B 2(Node1-Node2 Weight) - Export Options: Save graph as PNG for your notes or presentations
- No Dependencies: Pure HTML, CSS, and JavaScript - runs directly in your browser
- Responsive Design: Works on both desktop and mobile devices
When I was studying algorithms and data structures as a course in university, I often found myself needing to visualize graphs from my studies. When practicing with AI tools like ChatGPT, I'd receive graph definitions in formats like A-B 2 (representing an edge between node A and B with weight 2), but had to draw them manually to visualize them properly.
This tool was born out of that need - a simple, no-frills way to quickly visualize graphs without leaving the browser.
The easiest way is to use the live version—no setup required:
If you prefer running it locally:
-
Clone the repo
git clone https://github.com/tomcegraphics/graph-visualizer.git cd graph-visualizer -
Open the app
- Simply double-click
index.html - Or serve it locally for a smoother dev experience:
python -m http.server
Then visit: http://localhost:8000
- Simply double-click
This is a simple, self-contained project with no build step required.
To contribute or modify:
- Fork the repository
- Make your changes
- Open a pull request
This project is licensed under the MIT License - see the LICENSE file for details.
- Built with Sigma.js for graph visualization
- Inspired by countless algorithm study sessions
- Special thanks to the open source community for amazing tools and resources