Force-directed graph generator

Force-directed graph

Explore connections among entities as a network of nodes and links. Create a private, publication-ready force-directed graph directly in your browser without transmitting sensitive rows off-device. Data is processed locally on your hardware with zero server uploads, enabling instant export to SVG, PNG, and Excel data.

Hierarchy/networknetworkrelationshipsgraph

Edit the data, then export.

Everything runs in your browser. Your data is not uploaded.

Data

Paste tab-separated data from Excel or edit the cells directly.

Paste or import table data

Paste a header row, or choose a local CSV/TSV file. Files are read in this browser and capped at 500 rows.

Choose CSV/TSV

Appearance

Chart title

Palette

Width Data labels LegendBackground

Preview

Sample preview of the example data. The live chart takes over as soon as you start working.

SVG, PNG, and Excel exports are generated locally in this browser. PowerPoint export is temporarily unavailable while its dependency path is reviewed for a high-severity image parser advisory.

Hierarchical Structure & Parent-Child Nesting

A force-directed graph maps out network relationships using a physics-based simulation. Nodes act as charged particles that repel one another, while the links connecting them act like springs that pull related nodes together. The simulation runs iteratively until the forces reach equilibrium, settling the nodes into an optimal layout that minimizes edge crossings and highlights clusters. All rendering and physics calculations are processed entirely locally on your device, ensuring complete data privacy with no server uploads.

Tree Data Representation & Branching

Format input columns for force-directed graph with explicit headers and numerical measurements. Verify that rows represent discrete categories or observations without unformatted symbol artifacts.

Sample Node Hierarchy

| Source | Target | Weight |

Ensure sufficient visual distinction for force-directed graph marks across standard and high-contrast viewports.
Align text labels horizontally whenever possible to improve cognitive readability for force-directed graph elements.
Double-check scale boundaries and zero-anchors before exporting force-directed graph presentation artwork.

Data shape: Source, target, and optional link value columns
Exports: SVG, PNG, and Excel data; PowerPoint export is temporarily unavailable pending dependency review.

How it works

You edit a table in this page. The renderer draws an SVG from those rows in your browser, then you can download SVG, PNG, or Excel data. The table is not uploaded to any external processing server.

Frequently asked questions

How does a force-directed layout work?

Nodes repel each other like electric charges, while edges pull connected nodes together like springs until the physics simulation reaches equilibrium.

Arc diagramLay network nodes along a line and connect related pairs with arcs.Open Chord diagramShow complex inter-relationships and bidirectional flows between entities in a circular layout.Open Cluster treeArrange a parent-child hierarchy in a compact dendrogram to emphasize related branches and depth.Open Sankey diagramShow how quantities flow between stages, categories, or systems.Open Tidy treeExplain parent-child structure with a clean node-link layout and readable labels.Open

Reviewed 16 August 2026.

Force-directed graph generator