$ show anAcc22/another_graph_editor
Another Graph Editor is an interactive web application for visualizing and manipulating graphs, designed with competitive programming in mind. Built with React, TypeScript, Tailwind CSS, and HTML Canvas, it allows users to input graphs in various formats (edge lists, parent-child arrays, Leetcode-style) and visualize them with multiple layout options (force-directed, tree, bipartite, grid). The application implements numerous graph algorithms for visualization including connected components, bridges and cut vertices, biconnected components, and minimum spanning trees. Users can interact with the graph through drawing, coloring, and node/edge manipulation, with support for multiple test cases and export to PNG/SVG formats.
The LLM identified 4 files worth highlighting for reuse:
Provides a renderer abstraction layer that works with both HTML Canvas and SVG outputs. Defines a GraphRenderer interface and implements CanvasRenderer and SVGRenderer classes. Contains all drawing primitives (lines, arcs, circles, polygons) with proper handling of selected states, transparency, and special rendering modes. Demonstrates strong encapsulation and separation of rendering concerns from application logic.
Implements efficient algorithms for detecting bridges (cut edges) and cut vertices (articulation points) in undirected graphs. Uses depth-first search with discovery times and low-link values to identify bridges, and a separate algorithm for cut vertices. Returns boolean maps indicating which edges/vertices are bridges/cut points. The implementation is clean, self-contained, and could be easily reused in other graph visualization or analysis projects.
Provides implementations for finding connected components in undirected graphs and strongly connected components in directed graphs. Uses depth-first search to traverse and color components. The functions are pure, taking nodes and adjacency lists as input and returning color mappings. Demonstrates clean separation of graph algorithm logic from UI concerns, making it highly reusable.
Robust parser for multiple graph input formats including space-separated edge lists, parent-child arrays, and Leetcode-style notation (e.g., [[0,1],[1,2]]). Handles edge cases like empty inputs, multi-edge scenarios, and node labeling. Returns structured graph data or error status. The parser is well-structured with clear separation between different format handling logic.