[{"source":"A","target":"B","weight":4,"group":"Core"}]
Arc Diagram Maker
Build an arc diagram from source, target, weight, and group data, then inspect, style, and export the result.
Understand the diagram
Prepare relationship data
Each row represents a link from a source node to a target node. Source, target, and weight are required; group can be used for color grouping. Only one row is allowed for the same directed link.
Understand arcs and weights
The distance between nodes determines the arc span; a longer span does not mean a stronger relationship. Link weight maps to line width and is directly comparable only when the same chart uses one mapping range.
Choose an export format
SVG is suited to editing and print, PNG is convenient for immediate display, and CSV preserves the current valid links. A transparent background changes only the exported canvas, not the nodes or links.
Usage boundaries
- Up to 500 links and 200 nodes are supported.
- Weight must be a finite number greater than 0.
- Duplicate directed links and self-links are rejected.
More information
Usage and limits
Fields and workflow
- Provide source and target values.
- Add a numeric weight when magnitude matters.
- Use a group to organize related nodes.
Errors and validation
When a row has an empty node, a non-positive weight, a self-link, or a duplicate directed link, the tool identifies that row and pauses the chart so an old preview is not mistaken for the current result. Rendering resumes after the data is fixed.
How the chart is built
Nodes are placed at equal intervals along a horizontal baseline in the selected order. Each link uses half the distance between its two nodes as the horizontal radius; the curve setting changes the vertical radius without changing the data.
Line width maps the current minimum and maximum weights to the configured range. Color can encode group, source, a weight gradient, or one fixed color. Selecting a node highlights its directly connected links.
Frequently asked questions
Frequently asked questions
What data does an arc diagram use?
Each relationship row needs a source and target node. You can also provide a numeric weight and an optional group.
How is link thickness determined?
Link thickness is the visual mapping of each numeric weight to the configured width range; it is not a causal score.
Which export format should I choose?
SVG is best for editing and print, PNG is convenient for sharing, and CSV saves the current valid relationship data.
Privacy and implementation
Local processing
Data is parsed, rendered, and exported in this browser. Nothing is uploaded and no remote API is called.
Export notes
SVG stays sharp when scaled and is easy to edit. PNG is convenient for images and can use a transparent background, while CSV preserves the current relationship rows.
Implementation notes
The diagram is rendered with the browser's SVG and Canvas APIs.