Blog
Charts from data

CSV to slope chart online

A slope chart compares exactly two moments and nothing in between. Every category becomes a single line joining its old value to its new one, so the picture is a bundle of directions: what rose, what fell, and which changes were steep enough to matter.

Your data never leaves this device

Your data

Paste a table straight from Excel or Google Sheets, or drop a CSV file. Nothing is uploaded anywhere — the whole calculation runs inside this browser tab.

CSV, TSV or plain text. Files saved in windows-1251 are detected and re-read automatically, so Cyrillic headers do not turn into garbage.

Parsing options

Columns

Result

The drawing library is downloaded only when you press the button, and only on this page.

This page has no server side at all. The table you paste is parsed by JavaScript inside your own browser, the chart is drawn on a canvas element on your machine, and the export file is assembled locally. Nothing is uploaded, stored or written to any log. You can disconnect from the network after the page has loaded and everything will still work — which is the simplest way to verify the claim yourself.

Facts and limits of this method

Best for Comparing two periods across many categories at once
Columns used The first and last numeric columns; anything between them is ignored
Colour rule Green if the value rose, red if it fell, grey if unchanged
Legend Shown for up to 12 categories; above that labels would crowd out the chart
Category limit Around 20 — past that the lines tangle in the middle
Export contents Both values, the absolute change and the percentage change per row

When it misleads you

How it is calculated

Each row becomes one line with exactly two points: its value in the first numeric column and its value in the last. Columns in between are deliberately ignored — if you want them drawn, the multi-series line chart is the right page.

Lines are coloured by direction rather than by category: green for a rise, red for a fall, grey when the two values are equal. This is the one place in the section where colour encodes meaning rather than identity, because with twenty lines a categorical palette would be undecodable anyway.

The horizontal axis has exactly two positions, labelled with the names of the two columns. There is no axis in between because there is no data in between, and drawing intermediate gridlines would suggest otherwise.

The export carries four numbers per row: the starting value, the ending value, the absolute change and the percentage change. That last column is what people usually go looking for after seeing the slopes, and reading it off a picture is impossible.

Questions and answers

Which columns does it use if my table has four?

The first and the last numeric columns. Middle columns are ignored on purpose — a slope chart is a two-point comparison by definition. Reorder your columns if you need a different pair.

Why are the lines coloured green and red instead of by category?

Because with more than a handful of categories a colour-per-category legend becomes unreadable. Direction is the message here, so colour carries direction and the labels carry identity.

My lines all tangle in the middle.

That happens when many categories have similar values. A bar chart of the changes, sorted from largest gain to largest loss, communicates the same thing without the knot.

Can I show three periods?

Not as a slope chart — it is defined by having two. For three or more, use the multi-series line chart, where the intermediate points are real rather than implied.

Is my data sent anywhere?

No. Everything, including the percentage changes in the export, is computed inside your browser.

Related tools

All tools