Donut Chart Maker

How the Donut Chart Maker works

Donut chart maker: how it works

Data. The first column is the segment name and the first number column after it is the value. Values are divided by their sum to get each share, so raw counts work without converting them to percentages. Zero, blank and negative rows are skipped. Paste from a spreadsheet or type the rows by hand; the sample shows the expected two-column shape.

Ring and centre. Thin, Medium and Thick set how much of the radius the ring occupies. A thin ring is elegant on a dashboard card; a thick one holds larger segment labels. The centre can show the total, the total with a label beneath it, or nothing. The label defaults to the value column's header, so a column called Visits prints "Visits" under the number; type your own in Centre label to override it, for instance "responses" or "£ revenue".

Labels and legend. Segment labels print the percentage or the value on the ring, and segments too narrow to hold text are left blank rather than overlapping. The Right legend lists every segment with its value and exact share; Top gives a compact key of names above the chart; None relies on the segment labels alone. Largest first sorts the segments clockwise from the biggest, which is the conventional and most readable order.

Donut or pie. The two charts carry the same information. The donut's advantage is the centre: it shows the whole the parts belong to, which a pie leaves the reader to infer. The pie's advantage is that the eye judges the angle at the centre slightly better than the arc length on a ring. If the total is a number worth stating, use the donut; otherwise either works.

Export. Download SVG gives a vector file that stays sharp in a document or a slide, Download PNG renders it at 1×, 2× or 3× the preview width on white, and Copy SVG puts the markup on the clipboard. Nothing is uploaded and the data is gone when the page is closed.

Related tools