Create sunburst diagrams for hierarchical data with radial layout. Part of the DevTools Surf developer suite. Browse more tools in the Data / SQL collection.
Use Cases
Visualize file system directory structure with size-proportional arcs.
Show budget breakdown from total to category to line item across 3 hierarchy levels.
Display organizational hierarchy with headcount represented by arc width.
Represent a taxonomy (domain → category → subcategory → item) for an e-commerce product catalog.
Tips
Limit hierarchy depth to 3–4 levels — deeper levels produce arcs too thin to label or click meaningfully.
Use consistent color encoding for the outermost ring when comparing across datasets — audience attention goes to color first, so make it carry the most important dimension.
Provide a zoom or drill-down interaction for complex hierarchies — static sunbursts with many segments become illegible at any reasonable size.
Fun Facts
Sunburst charts are a radial variant of treemaps. Both emerged from research on hierarchical data visualization in the early 2000s; Ben Shneiderman's treemap work (1992) preceded and inspired the sunburst approach.
John Stasko at Georgia Tech's information interfaces research group is credited with popularizing the sunburst layout in a 2000 paper on 'Space-Constrained Tree Visualization.'
D3.js (2011) made interactive sunburst charts practical for the web, with the d3.partition layout and arc generator handling the geometry automatically — before D3, implementing a zoomable sunburst required significant custom canvas code.
FAQ
Sunburst vs. treemap — when do I use each?
Use a sunburst when hierarchy and proportion both matter and you have a clear root node. Use a treemap when proportion is primary and hierarchy is secondary, or when you have a large number of leaf nodes.
What data format does a sunburst chart require?
A nested hierarchical structure (parent-child relationships with values at leaves) or a flat table with path columns (breadcrumb1, breadcrumb2, value). The visualization software handles the layout from either format.
