Overview
Turns a plain list of label and value lines into a finished chart - line, bar, pie, doughnut, or scatter - rendered with Chart.js in your browser. Paste numbers, get a preview instantly, download a PNG for a slide or report, and read the same data back from an accessible table that does not depend on colour or vision.
How It Works
Choose a chart type, then type or paste your data one point per line as label, value - for example Jan, 12. For scatter charts use label, x, y. The preview redraws on every keystroke; a malformed line is reported with its line number instead of failing silently. Give the chart a title, switch types to compare how the same data reads, and use Download PNG when the preview looks right.
Step-by-Step Usage Guide
- Pick the chart type that matches your question: comparison (bar), trend (line), share of a whole (pie or doughnut), or correlation (scatter).
- Paste your data as one label, value pair per line; fix any highlighted line number the validator reports.
- Type a chart title - it becomes the dataset label and the downloaded file name.
- Download the PNG, or copy the data table's values for a document.
Technical Specifications & Standards
The renderer is Chart.js 4 loaded through a dynamic import, so its bundle only downloads when a chart is actually drawn and never slows other tool pages. Every type change destroys and rebuilds the chart instance, which avoids the ghost-trace artefacts that appear when datasets are mutated in place. Pie and doughnut charts colour each slice from a fixed categorical palette; line, bar, and scatter use one accent colour - which is exactly why the tool also renders a data table alongside the canvas. The table is the accessibility contract: screen readers announce it as a table, colour-blind users read it directly, and it doubles as a sanity check that the parser interpreted your lines the way you meant. Parsing splits each line at the last comma, so labels may themselves contain commas; values accept decimals and negatives, and scatter keeps x-y order.
Targeted Use Cases
- A quick weekly-figures chart for a standup or status email, without opening a spreadsheet.
- Turning survey or poll counts into a pie chart for a blog post or slide.
- Scatter-plotting two measured columns to eyeball correlation before running real statistics.
- Checking that a CSV you received parses into sensible categories before automating it.
Notes & Gotchas
- Bar charts compare quantities more honestly than pies; keep pies to five or six slices.
- Sort bar data descending before pasting - the tool draws lines in your order, it does not rank for you.
- Keep one series per chart; mixing units on one axis misleads more than it informs.
- Start scatter y-axes near zero only if the story is magnitude; otherwise let Chart.js auto-scale to show the relationship.
Frequently Asked Questions
Is my data uploaded anywhere?
No. Parsing and rendering happen entirely in your browser with Chart.js running locally; nothing leaves the page, and the PNG download is generated from the canvas on your device.
Why does my label with a comma still work?
The parser splits each line at the last comma, so 'Q1, North, 42' is read as label 'Q1, North' with value 42. Only the final field needs to be numeric.
Can I export an SVG or PDF?
Not currently - the export is a PNG rendered from the canvas at screen resolution. For vector output, chart libraries' JSON or a spreadsheet tool is a better fit.
Why is there a table under the chart?
Charts fail as accessible content if the only signal is colour and shape. The table restates every point in text for screen readers and colour-blind users, and lets you verify the parsed values at a glance.