OneTaskBy Tim King · Updated
Sunburst Chart Maker
Nested Rings from an Indented List, Free
OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.
How the Sunburst Chart Maker works
This sunburst chart maker draws a hierarchy as rings. A sunburst chart is a pie chart with levels: the inner ring shows the top groups, the next ring splits each group into its parts, and so on outward. Every arc is sized by its value and lines up with its parent, so you can read both the whole and the breakdown in one glance. Type the items as an indented list with a value on each leaf and this page draws the rings, colours them by top-level group and lets you download SVG or PNG. Nothing is uploaded.
Sunburst chart maker: writing the list
One item per line, indented two spaces or one tab per level. A line is the child of the nearest line above it with less indentation. Leaf lines end with a comma or colon and a number: "Google, 5200". Groups take their size from the sum of their children, so they need no value. A leaf with no number counts as 1. Lines starting with "#" are ignored. If there is a single top line it becomes the title in the centre of the chart; several top lines become the inner ring.
Rings and the centre hole
Each level of indentation is one ring. Rings shown limits how many levels are drawn, which is useful for a deep list where the outer rings would become slivers; the values still include everything underneath. Centre hole sets the empty circle in the middle as a percentage of the radius. A larger hole gives the inner arcs more length, so their labels fit, and leaves room for the title.
Order and colour
As typed keeps the arcs in the order of your lines, running clockwise from the top. Largest first sorts every ring by value, biggest arc first, which makes it easy to spot the main contributors. Colour follows the top-level group: every arc inherits the colour of its outermost ancestor and fades slightly with each level, so the chart reads as coloured wedges subdivided outward. The palette menu switches the colour set.
Labels
Names are drawn along each arc, rotated to follow the ring and flipped on the left side so they read the right way up. Only arcs long enough to hold text get a label; the rest keep their name, full path and value as a hover title, which also survives in the downloaded SVG. Name and value adds the formatted number after each name. Number format sets thousands separators, decimals, currency or percentage.
Exporting
Download SVG gives a vector file with labels as text and hover titles for every arc. Download PNG renders at one, two or three times the preview width. Copy SVG puts the markup on the clipboard. Everything is drawn in your browser; the text never leaves your machine.
FAQ
What is the difference between a sunburst and a treemap?
Both show a hierarchy with areas proportional to value. A treemap uses nested rectangles and fits more labels in the same space; a sunburst uses rings and makes the levels obvious, since each ring is one level deep. Use a sunburst when the structure matters as much as the numbers, and a treemap when there are many small items.
Why is an arc unlabelled?
Labels need enough arc length to hold the text, roughly 14 pixels or more at the middle of the ring, and rings need to be at least 16 pixels thick. Reduce Rings shown, widen the preview, or lower the centre hole to make the outer arcs longer. Every arc keeps its name and value as a hover title.
Can I show only the top levels?
Yes. Rings shown limits how many levels are drawn. The values are unchanged, since a group's size always includes everything under it; only the outer rings are omitted.
How do I write the values?
Put a comma or a colon and a number at the end of each leaf line. Groups take the sum of their children. Numbers may have decimals; thousands separators are added by the Number format menu, not read from the text.
See also: all Diagram Makers tools, Images, Audio, Video & Screen, PDF, SVG, Simulations & Screensavers, Generative Art, Chart Makers, 3D Model Viewers, Drawing Pads, Mockups & 3D Making, 3D Science, Tracker Music.
Related tools
Treemap Maker
Type an indented list with values and download a treemap as SVG or PNG.
Donut Chart Maker
Paste label,value rows, get a donut with the total in the middle.
Pie Chart Maker
Paste label,value rows, get a labelled pie chart; download SVG or PNG.
Indent Code
Shift every line right by a set number of spaces or tabs.
SVG To PNG
Rasterise an SVG to a PNG at any width.