Graph Visualizer & Editor

An edge list is the least readable format for a graph and the only one problems are ever stated in. Paste one into the Graph Visualizer and it lays the vertices out with a force simulation, so a tree looks like a tree and a cycle is visible as a cycle rather than as a row of number pairs.

Layout works by physics rather than by hierarchy. Every pair of nodes repels, every edge pulls its endpoints together, and velocity decays each tick until the arrangement settles. Drag any node and the simulation reheats, which is how you untangle a knot the automatic placement left behind.

Three property badges light up as the structure warrants: Tree, Has Cycle and Disconnected, alongside a connectivity badge that reads weakly connected on a directed graph. Cycles are found by a depth-first search colouring nodes white, grey and black, which is the standard way to distinguish a back edge from a forward one.

Getting a Graph Onto the Canvas

1. The editor starts on a 7-node tree written as 6 lines of 0 1 style pairs. Load Sample Tree moves to the next stored edge list, and you can paste your own with one edge per line.
2. Add a third number for a weight, so 0 1 5 is an edge of weight 5. Mixing weighted and unweighted lines is fine, and the label only renders where a weight exists.
3. Tick Directed if the edges are ordered. Arrowheads appear and the cycle test switches to the directed definition, where a pair of opposite edges is a cycle and an undirected repeat is not.
4. Tick 1-indexed when your problem numbers vertices from 1, which relabels without renumbering your input.
5. Drag nodes to arrange them for a screenshot. The simulation cools again on its own once you let go.

Edge Cases the Property Badges Catch

• Tree requires all 4 conditions at once: undirected, acyclic, connected, and exactly V minus 1 edges. Any one of them failing turns the badge off, which makes it a genuine check rather than an edge count.
• Has Cycle uses a 3-colour depth-first search. A grey node reached a second time is a back edge and therefore a cycle; a black one has already finished and is not.
• Disconnected counts components. On a directed graph connectivity is reported as weak, meaning the underlying undirected graph is connected, which is the cheaper and more commonly wanted test.
• A self-loop is a cycle of length 1 and registers as one. A repeated edge between the same pair counts twice towards E, so it breaks the tree test even when the drawing looks like a tree.
• An isolated vertex only exists if some line mentions it. An edge list cannot express a vertex with no edges, so the vertex count comes from what appears in the input.