Circle packing charts visualize hierarchical data as nested circles, where each circle's area is proportional to its value. Child circles are packed inside their parent circle, making the containment relationship immediately visible. They are a visually engaging alternative to treemaps when a circular aesthetic is preferred.

Subtype

▾

Live Preview

This chart type requires a Pro license.

Please upgrade to unlock advanced visualizations.

{
  "title": {
    "text": "Tech Company Market Cap ($B)"
  },
  "data": [
    {
      "id": "root",
      "parent": null,
      "name": "Market",
      "value": 0
    },
    {
      "id": "mega",
      "parent": "root",
      "name": "Mega Cap",
      "value": 0
    },
    {
      "id": "AAPL",
      "parent": "mega",
      "name": "Apple",
      "value": 2800
    },
    {
      "id": "MSFT",
      "parent": "mega",
      "name": "Microsoft",
      "value": 2600
    },
    {
      "id": "NVDA",
      "parent": "mega",
      "name": "NVIDIA",
      "value": 2200
    },
    {
      "id": "large",
      "parent": "root",
      "name": "Large Cap",
      "value": 0
    },
    {
      "id": "META",
      "parent": "large",
      "name": "Meta",
      "value": 1400
    },
    {
      "id": "AVGO",
      "parent": "large",
      "name": "Broadcom",
      "value": 820
    },
    {
      "id": "ORCL",
      "parent": "large",
      "name": "Oracle",
      "value": 420
    },
    {
      "id": "AMD",
      "parent": "large",
      "name": "AMD",
      "value": 280
    },
    {
      "id": "mid",
      "parent": "root",
      "name": "Mid Cap",
      "value": 0
    },
    {
      "id": "SNOW",
      "parent": "mid",
      "name": "Snowflake",
      "value": 48
    },
    {
      "id": "DDOG",
      "parent": "mid",
      "name": "Datadog",
      "value": 42
    },
    {
      "id": "CRWD",
      "parent": "mid",
      "name": "CrowdStrike",
      "value": 86
    }
  ],
  "series": [
    {
      "type": "circlepacking",
      "nameKey": "id",
      "parentKey": "parent",
      "valueKey": "value",
      "fills": [
        "#6366f1",
        "#8b5cf6",
        "#f43f5e",
        "#f59e0b",
        "#10b981"
      ]
    }
  ]
}

Edit JSON above · auto-previews after 0.9 s

Company market capitalizations packed as circles within their industry sector group.

PreviousTreemap Charts Next Icicle Charts

Was this article helpful?