About Sunburst Diagram Generator

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.