Chart maker
Paste CSV or tab-separated data and instantly build line, bar, stacked bar, area, pie, donut, scatter and radar charts, then export the SVG source.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Data (first row is the header)
The first column holds the labels, the remaining columns hold numbers. Comma and tab separators both work; values may be quoted.
Chart preview
The chart is drawn with an SVG generated right here — your data never leaves the browser.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 420" width="720" height="420" role="img" aria-label="chart" data-test-id="chart" font-family="system-ui, -apple-system, 'Segoe UI', sans-serif"><line x1="58" y1="358.00" x2="702.00" y2="358.00" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="358.00" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">0</text><line x1="58" y1="289.60" x2="702.00" y2="289.60" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="289.60" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">50</text><line x1="58" y1="221.20" x2="702.00" y2="221.20" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="221.20" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">100</text><line x1="58" y1="152.80" x2="702.00" y2="152.80" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="152.80" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">150</text><line x1="58" y1="84.40" x2="702.00" y2="84.40" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="84.40" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">200</text><line x1="58" y1="16.00" x2="702.00" y2="16.00" stroke="#9ca3af" stroke-opacity="0.28" stroke-width="1"/><text x="50" y="16.00" text-anchor="end" dominant-baseline="middle" font-size="11" fill="#6b7280">250</text><line x1="58" y1="16" x2="58" y2="358" stroke="#9ca3af" stroke-opacity="0.5" stroke-width="1"/><line x1="58" y1="358" x2="702" y2="358" stroke="#9ca3af" stroke-opacity="0.5" stroke-width="1"/><text x="138.50" y="376" text-anchor="middle" font-size="11" fill="#6b7280">Q1</text><text x="299.50" y="376" text-anchor="middle" font-size="11" fill="#6b7280">Q2</text><text x="460.50" y="376" text-anchor="middle" font-size="11" fill="#6b7280">Q3</text><text x="621.50" y="376" text-anchor="middle" font-size="11" fill="#6b7280">Q4</text><polyline data-series="Sales" points="138.50,193.84 299.50,152.80 460.50,111.76 621.50,70.72" fill="none" stroke="#4d6bfe" stroke-width="2" stroke-linejoin="round" stroke-linecap="round"/><circle cx="138.50" cy="193.84" r="3" fill="#4d6bfe"><title>Sales · Q1: 120</title></circle><circle cx="299.50" cy="152.80" r="3" fill="#4d6bfe"><title>Sales · Q2: 150</title></circle><circle cx="460.50" cy="111.76" r="3" fill="#4d6bfe"><title>Sales · Q3: 180</title></circle><circle cx="621.50" cy="70.72" r="3" fill="#4d6bfe"><title>Sales · Q4: 210</title></circle><polyline data-series="Cost" points="138.50,248.56 299.50,228.04 460.50,207.52 621.50,193.84" fill="none" stroke="#f59e0b" stroke-width="2" stroke-linejoin="round" stroke-linecap="round"/><circle cx="138.50" cy="248.56" r="3" fill="#f59e0b"><title>Cost · Q1: 80</title></circle><circle cx="299.50" cy="228.04" r="3" fill="#f59e0b"><title>Cost · Q2: 95</title></circle><circle cx="460.50" cy="207.52" r="3" fill="#f59e0b"><title>Cost · Q3: 110</title></circle><circle cx="621.50" cy="193.84" r="3" fill="#f59e0b"><title>Cost · Q4: 120</title></circle><g transform="translate(12 402)"><rect width="10" height="10" rx="2" fill="#4d6bfe"/><text x="15" y="9" font-size="11" fill="#6b7280">Sales</text></g><g transform="translate(130 402)"><rect width="10" height="10" rx="2" fill="#f59e0b"/><text x="15" y="9" font-size="11" fill="#6b7280">Cost</text></g></svg>
What this tool does
- Paste two columns copied from Excel and get a line or bar chart you can drop into a document or slide deck without opening a charting app.
- Need a static image for docs? Export the SVG source, inline it in the page and it stays sharp at any zoom while you keep full control of the colors.
- Compare several series at once with stacked bars or an area chart — one column per series, legend and grid toggles right in the toolbar.
- Show a single dimension’s share with a pie or donut chart; eight chart types cover most quick visualisations.
Example
Input
Quarter,Sales,Cost Q1,120,80 Q2,150,95 Q3,180,110 Q4,210,120
Output
<svg viewBox="0 0 720 420"> line chart: y-axis ticks 0/50/100/150/200/250, one polyline and 4 data points per series, legend reading "Sales" and "Cost"
The first column holds the labels and the rest hold numbers; commas and tabs are both detected automatically and thousand separators in numbers are ignored.
Frequently asked questions
Why do I get "at least two columns are needed" or "a cell is not a valid number"?
The table shape is fixed: labels in the first column, numbers in the rest, so a single column cannot be charted. A blank cell, a unit suffix like "120k" or text such as "n/a" in a numeric column fails too — clean the data first.
Why do pie and donut charts reject negative values or a zero total?
A pie chart expresses shares, so negative values are meaningless and an all-zero column cannot produce any slice, which is why both are hard errors. Switch to a bar or line chart and negative values render fine.
Why does a radar chart need at least 3 rows?
A radar chart connects the axis vertices into a polygon, and fewer than three axes cannot form one. For a two-dimension comparison a bar chart reads better anyway.
Is there a size limit?
Up to 2000 rows and 24 columns. The output is plain SVG text, so more than that becomes heavy to render and to read; you get a clear notice instead of a frozen tab.
Is the data uploaded anywhere?
No. Parsing and SVG generation are pure front-end computation — no network requests, the data never leaves the browser and it works offline.
Keywords：chartchart makersvg chartline chartbar chartpie chartradar chart图表图表生成折线图柱状图饼图雷达图svg 图表