# Region › Country with products (explicit map) (Radial Column example)

> WestCoast Charts 1.1.5, release, public Core release, on npm. HTML: https://westcoast-charts.com/gallery/radial-column/multi-drill/ · Index for agents: https://westcoast-charts.com/llms.txt

A Region › Country sunburst inside, 16 products outside. An explicit map says which products each country sells: hover a country (or a region) to see them, click to cross-filter the ring to that country's revenue.

- Chart type: `radialColumn` (Radial Column)
- Collection: Radial Column · Radial Column · Linked layers
- Raw configuration: https://westcoast-charts.com/gallery-src/radial-column/multi-drill.js
- Standalone example: https://westcoast-charts.com/embed/samples/wcc/premium/radial-column.html?only=multi-drill

## Setup

```js
import WestCoastCharts from 'west-coast-charts'
import premium from 'west-coast-charts/premium'

WestCoastCharts.use(premium)
const WestCoastChartsPremium = premium
WestCoastCharts.setLicenseKey(LICENCE_KEY) // paid production licence; localhost evaluation needs no key
```

## Options

```js
const options = {
  "chart": {
    "type": "radialColumn",
    "height": 540,
    "toolbar": {
      "show": false
    }
  },
  "series": [
    {
      "name": "Revenue",
      "data": [
        334,
        367,
        379,
        292,
        327,
        293,
        332,
        311,
        383,
        327,
        282,
        395,
        174,
        431,
        355,
        268
      ]
    }
  ],
  "xaxis": {
    "categories": [
      "Atlas",
      "Bolt",
      "Cirrus",
      "Delta",
      "Ember",
      "Flux",
      "Glide",
      "Halo",
      "Ion",
      "Jade",
      "Kite",
      "Lumen",
      "Mesa",
      "Nova",
      "Orbit",
      "Pike"
    ]
  },
  "plotOptions": {
    "radialColumn": {
      "innerRadius": 0.56,
      "link": {
        "mode": "map",
        "interaction": "both",
        "unit": "products",
        "map": function (s) { return s.depth === 1 ? sells[s.name] : null }
      },
      "layers": [
        {
          "type": "sunburst",
          "name": "Markets",
          "data": [
            {
              "x": "EMEA",
              "children": [
                {
                  "x": "Germany",
                  "y": 523,
                  "values": [
                    72,
                    44,
                    0,
                    78,
                    0,
                    29,
                    0,
                    80,
                    27,
                    0,
                    78,
                    0,
                    42,
                    0,
                    73,
                    0
                  ]
                },
                {
                  "x": "France",
                  "y": 531,
                  "values": [
                    55,
                    0,
                    64,
                    66,
                    0,
                    52,
                    0,
                    75,
                    0,
                    38,
                    0,
                    79,
                    22,
                    0,
                    80,
                    0
                  ]
                },
                {
                  "x": "UK",
                  "y": 537,
                  "values": [
                    33,
                    0,
                    76,
                    0,
                    47,
                    0,
                    69,
                    60,
                    0,
                    59,
                    0,
                    70,
                    0,
                    46,
                    77,
                    0
                  ]
                },
                {
                  "x": "Nordics",
                  "y": 510,
                  "values": [
                    0,
                    31,
                    80,
                    0,
                    24,
                    0,
                    79,
                    0,
                    39,
                    74,
                    0,
                    53,
                    0,
                    65,
                    0,
                    65
                  ]
                }
              ]
            },
            {
              "x": "Americas",
              "children": [
                {
                  "x": "USA",
                  "y": 505,
                  "values": [
                    54,
                    0,
                    74,
                    0,
                    40,
                    79,
                    0,
                    25,
                    0,
                    80,
                    0,
                    31,
                    0,
                    77,
                    45,
                    0
                  ]
                },
                {
                  "x": "Canada",
                  "y": 519,
                  "values": [
                    71,
                    0,
                    58,
                    0,
                    61,
                    0,
                    69,
                    0,
                    48,
                    76,
                    0,
                    34,
                    0,
                    80,
                    0,
                    22
                  ]
                },
                {
                  "x": "Brazil",
                  "y": 542,
                  "values": [
                    0,
                    79,
                    0,
                    37,
                    75,
                    0,
                    51,
                    0,
                    67,
                    0,
                    63,
                    56,
                    0,
                    72,
                    0,
                    42
                  ]
                }
              ]
            },
            {
              "x": "APAC",
              "children": [
                {
                  "x": "Japan",
                  "y": 525,
                  "values": [
                    0,
                    78,
                    27,
                    0,
                    80,
                    0,
                    28,
                    0,
                    78,
                    0,
                    43,
                    72,
                    0,
                    56,
                    0,
                    63
                  ]
                },
                {
                  "x": "Australia",
                  "y": 519,
                  "values": [
                    0,
                    67,
                    0,
                    50,
                    0,
                    75,
                    36,
                    0,
                    79,
                    0,
                    21,
                    0,
                    80,
                    35,
                    0,
                    76
                  ]
                },
                {
                  "x": "India",
                  "y": 539,
                  "values": [
                    49,
                    68,
                    0,
                    61,
                    0,
                    58,
                    0,
                    71,
                    45,
                    0,
                    77,
                    0,
                    30,
                    0,
                    80,
                    0
                  ]
                }
              ]
            }
          ]
        }
      ]
    }
  }
}

const chart = new WestCoastCharts(document.querySelector('#chart'), options)
await chart.render()
```

## Verify

- Text check (Library 1.1.5): load `west-coast-charts/agent/describe` and call `chart.describe({ format: "json" })` for the actual drawn state. The live reader is on this example’s HTML page.
- Command line (Public agent tools 0.2.3, tested with Library 1.1.5; available from the versioned GitHub release and npm, https://westcoast-charts.com/docs/cli/index.md): `wcc chart export radial-column-multi-drill.json --out radial-column-multi-drill.svg --with-table` (save the options above as JSON first)