Normalize
Absolute counts divided by population (per million people).
Open the chart without page chrome ↗Drawing width at least 900 px. Scroll within the chart on smaller screens.
const options = {
"chart": {
"height": 480,
"toolbar": {
"show": false
},
"type": "map"
},
"series": [
{
"name": "Registrations",
"data": [
{
"id": "DEU",
"value": 19588,
"pop": 231000000
},
{
"id": "FRA",
"value": 56178,
"pop": 234000000
},
{
"id": "GBR",
"value": 35232,
"pop": 179000000
},
{
"id": "ITA",
"value": 47312,
"pop": 164000000
},
{
"id": "ESP",
"value": 84403,
"pop": 141000000
},
{
"id": "NLD",
"value": 30817,
"pop": 92000000
},
{
"id": "BEL",
"value": 5972,
"pop": 137000000
},
{
"id": "CHE",
"value": 43483,
"pop": 262000000
},
{
"id": "AUT",
"value": 56272,
"pop": 149000000
},
{
"id": "POL",
"value": 24899,
"pop": 228000000
},
{
"id": "SWE",
"value": 26606,
"pop": 61000000
},
{
"id": "NOR",
"value": 18175,
"pop": 86000000
},
{
"id": "DNK",
"value": 7665,
"pop": 65000000
},
{
"id": "FIN",
"value": 38454,
"pop": 207000000
},
{
"id": "IRL",
"value": 20537,
"pop": 116000000
},
{
"id": "PRT",
"value": 69995,
"pop": 248000000
},
{
"id": "CZE",
"value": 35678,
"pop": 41000000
},
{
"id": "HUN",
"value": 76241,
"pop": 240000000
},
{
"id": "ROU",
"value": 67935,
"pop": 60000000
},
{
"id": "GRC",
"value": 27198,
"pop": 10000000
},
{
"id": "SVK",
"value": 3070,
"pop": 89000000
},
{
"id": "BGR",
"value": 89281,
"pop": 113000000
},
{
"id": "HRV",
"value": 45902,
"pop": 193000000
},
{
"id": "SRB",
"value": 73400,
"pop": 26000000
},
{
"id": "SVN",
"value": 21018,
"pop": 90000000
},
{
"id": "LTU",
"value": 4491,
"pop": 79000000
},
{
"id": "LVA",
"value": 60280,
"pop": 190000000
},
{
"id": "EST",
"value": 68150,
"pop": 178000000
},
{
"id": "UKR",
"value": 61653,
"pop": 186000000
},
{
"id": "BLR",
"value": 42981,
"pop": 283000000
},
{
"id": "ISL",
"value": 5261,
"pop": 96000000
},
{
"id": "USA",
"value": 37465,
"pop": 178000000
},
{
"id": "CAN",
"value": 2568,
"pop": 109000000
},
{
"id": "MEX",
"value": 3395,
"pop": 24000000
},
{
"id": "GTM",
"value": 50317,
"pop": 269000000
},
{
"id": "CRI",
"value": 54870,
"pop": 286000000
},
{
"id": "PAN",
"value": 75920,
"pop": 240000000
},
{
"id": "CUB",
"value": 58153,
"pop": 152000000
},
{
"id": "DOM",
"value": 30939,
"pop": 29000000
},
{
"id": "BRA",
"value": 1523,
"pop": 216000000
},
{
"id": "ARG",
"value": 40514,
"pop": 82000000
},
{
"id": "CHL",
"value": 20890,
"pop": 143000000
},
{
"id": "COL",
"value": 77768,
"pop": 159000000
},
{
"id": "PER",
"value": 59456,
"pop": 113000000
},
{
"id": "URY",
"value": 66516,
"pop": 195000000
},
{
"id": "ECU",
"value": 17570,
"pop": 18000000
},
{
"id": "VEN",
"value": 78195,
"pop": 125000000
},
{
"id": "BOL",
"value": 14011,
"pop": 259000000
},
{
"id": "PRY",
"value": 7456,
"pop": 29000000
},
{
"id": "JPN",
"value": 83271,
"pop": 159000000
},
{
"id": "KOR",
"value": 51566,
"pop": 191000000
},
{
"id": "CHN",
"value": 16622,
"pop": 172000000
},
{
"id": "IND",
"value": 89086,
"pop": 275000000
},
{
"id": "IDN",
"value": 74086,
"pop": 144000000
},
{
"id": "SGP",
"value": 72049,
"pop": 51000000
},
{
"id": "MYS",
"value": 29565,
"pop": 22000000
},
{
"id": "THA",
"value": 1697,
"pop": 80000000
},
{
"id": "VNM",
"value": 29239,
"pop": 18000000
},
{
"id": "PHL",
"value": 10215,
"pop": 166000000
},
{
"id": "ISR",
"value": 363,
"pop": 163000000
},
{
"id": "ARE",
"value": 88813,
"pop": 236000000
},
{
"id": "SAU",
"value": 5288,
"pop": 107000000
},
{
"id": "TUR",
"value": 48781,
"pop": 137000000
},
{
"id": "KAZ",
"value": 56442,
"pop": 72000000
},
{
"id": "PAK",
"value": 52431,
"pop": 186000000
},
{
"id": "BGD",
"value": 31491,
"pop": 123000000
},
{
"id": "LKA",
"value": 12088,
"pop": 10000000
},
{
"id": "AUS",
"value": 55316,
"pop": 166000000
},
{
"id": "NZL",
"value": 14857,
"pop": 106000000
},
{
"id": "ZAF",
"value": 6987,
"pop": 99000000
},
{
"id": "NGA",
"value": 48940,
"pop": 59000000
},
{
"id": "EGY",
"value": 48108,
"pop": 134000000
},
{
"id": "KEN",
"value": 47512,
"pop": 282000000
},
{
"id": "MAR",
"value": 8011,
"pop": 299000000
},
{
"id": "GHA",
"value": 39609,
"pop": 237000000
},
{
"id": "ETH",
"value": 373,
"pop": 129000000
},
{
"id": "TZA",
"value": 4411,
"pop": 40000000
},
{
"id": "DZA",
"value": 6377,
"pop": 42000000
},
{
"id": "TUN",
"value": 74883,
"pop": 172000000
},
{
"id": "SEN",
"value": 27422,
"pop": 267000000
},
{
"id": "CIV",
"value": 70052,
"pop": 165000000
},
{
"id": "AGO",
"value": 41186,
"pop": 267000000
}
]
}
],
"plotOptions": {
"map": {
"map": "world-small-states",
"normalize": {
"by": "pop",
"per": 1000000,
"label": "per million"
}
}
},
"theme": {
"mode": "light",
"preset": "coastal"
}
}
const chart = new WestCoastCharts(document.querySelector('#chart'), options)
chart.render()import WestCoastCharts from 'west-coast-charts'
import types from 'west-coast-charts/types'
import premium from 'west-coast-charts/premium'
import 'west-coast-charts/maps/world-small-states' // registers the map shapes
WestCoastCharts.use(types).use(premium)
const WestCoastChartsPremium = premium
WestCoastCharts.setLicenseKey(LICENCE_KEY) // paid production licence; localhost evaluation needs no key
const options = {
"chart": {
"height": 480,
"toolbar": {
"show": false
},
"type": "map"
},
"series": [
{
"name": "Registrations",
"data": [
{
"id": "DEU",
"value": 19588,
"pop": 231000000
},
{
"id": "FRA",
"value": 56178,
"pop": 234000000
},
{
"id": "GBR",
"value": 35232,
"pop": 179000000
},
{
"id": "ITA",
"value": 47312,
"pop": 164000000
},
{
"id": "ESP",
"value": 84403,
"pop": 141000000
},
{
"id": "NLD",
"value": 30817,
"pop": 92000000
},
{
"id": "BEL",
"value": 5972,
"pop": 137000000
},
{
"id": "CHE",
"value": 43483,
"pop": 262000000
},
{
"id": "AUT",
"value": 56272,
"pop": 149000000
},
{
"id": "POL",
"value": 24899,
"pop": 228000000
},
{
"id": "SWE",
"value": 26606,
"pop": 61000000
},
{
"id": "NOR",
"value": 18175,
"pop": 86000000
},
{
"id": "DNK",
"value": 7665,
"pop": 65000000
},
{
"id": "FIN",
"value": 38454,
"pop": 207000000
},
{
"id": "IRL",
"value": 20537,
"pop": 116000000
},
{
"id": "PRT",
"value": 69995,
"pop": 248000000
},
{
"id": "CZE",
"value": 35678,
"pop": 41000000
},
{
"id": "HUN",
"value": 76241,
"pop": 240000000
},
{
"id": "ROU",
"value": 67935,
"pop": 60000000
},
{
"id": "GRC",
"value": 27198,
"pop": 10000000
},
{
"id": "SVK",
"value": 3070,
"pop": 89000000
},
{
"id": "BGR",
"value": 89281,
"pop": 113000000
},
{
"id": "HRV",
"value": 45902,
"pop": 193000000
},
{
"id": "SRB",
"value": 73400,
"pop": 26000000
},
{
"id": "SVN",
"value": 21018,
"pop": 90000000
},
{
"id": "LTU",
"value": 4491,
"pop": 79000000
},
{
"id": "LVA",
"value": 60280,
"pop": 190000000
},
{
"id": "EST",
"value": 68150,
"pop": 178000000
},
{
"id": "UKR",
"value": 61653,
"pop": 186000000
},
{
"id": "BLR",
"value": 42981,
"pop": 283000000
},
{
"id": "ISL",
"value": 5261,
"pop": 96000000
},
{
"id": "USA",
"value": 37465,
"pop": 178000000
},
{
"id": "CAN",
"value": 2568,
"pop": 109000000
},
{
"id": "MEX",
"value": 3395,
"pop": 24000000
},
{
"id": "GTM",
"value": 50317,
"pop": 269000000
},
{
"id": "CRI",
"value": 54870,
"pop": 286000000
},
{
"id": "PAN",
"value": 75920,
"pop": 240000000
},
{
"id": "CUB",
"value": 58153,
"pop": 152000000
},
{
"id": "DOM",
"value": 30939,
"pop": 29000000
},
{
"id": "BRA",
"value": 1523,
"pop": 216000000
},
{
"id": "ARG",
"value": 40514,
"pop": 82000000
},
{
"id": "CHL",
"value": 20890,
"pop": 143000000
},
{
"id": "COL",
"value": 77768,
"pop": 159000000
},
{
"id": "PER",
"value": 59456,
"pop": 113000000
},
{
"id": "URY",
"value": 66516,
"pop": 195000000
},
{
"id": "ECU",
"value": 17570,
"pop": 18000000
},
{
"id": "VEN",
"value": 78195,
"pop": 125000000
},
{
"id": "BOL",
"value": 14011,
"pop": 259000000
},
{
"id": "PRY",
"value": 7456,
"pop": 29000000
},
{
"id": "JPN",
"value": 83271,
"pop": 159000000
},
{
"id": "KOR",
"value": 51566,
"pop": 191000000
},
{
"id": "CHN",
"value": 16622,
"pop": 172000000
},
{
"id": "IND",
"value": 89086,
"pop": 275000000
},
{
"id": "IDN",
"value": 74086,
"pop": 144000000
},
{
"id": "SGP",
"value": 72049,
"pop": 51000000
},
{
"id": "MYS",
"value": 29565,
"pop": 22000000
},
{
"id": "THA",
"value": 1697,
"pop": 80000000
},
{
"id": "VNM",
"value": 29239,
"pop": 18000000
},
{
"id": "PHL",
"value": 10215,
"pop": 166000000
},
{
"id": "ISR",
"value": 363,
"pop": 163000000
},
{
"id": "ARE",
"value": 88813,
"pop": 236000000
},
{
"id": "SAU",
"value": 5288,
"pop": 107000000
},
{
"id": "TUR",
"value": 48781,
"pop": 137000000
},
{
"id": "KAZ",
"value": 56442,
"pop": 72000000
},
{
"id": "PAK",
"value": 52431,
"pop": 186000000
},
{
"id": "BGD",
"value": 31491,
"pop": 123000000
},
{
"id": "LKA",
"value": 12088,
"pop": 10000000
},
{
"id": "AUS",
"value": 55316,
"pop": 166000000
},
{
"id": "NZL",
"value": 14857,
"pop": 106000000
},
{
"id": "ZAF",
"value": 6987,
"pop": 99000000
},
{
"id": "NGA",
"value": 48940,
"pop": 59000000
},
{
"id": "EGY",
"value": 48108,
"pop": 134000000
},
{
"id": "KEN",
"value": 47512,
"pop": 282000000
},
{
"id": "MAR",
"value": 8011,
"pop": 299000000
},
{
"id": "GHA",
"value": 39609,
"pop": 237000000
},
{
"id": "ETH",
"value": 373,
"pop": 129000000
},
{
"id": "TZA",
"value": 4411,
"pop": 40000000
},
{
"id": "DZA",
"value": 6377,
"pop": 42000000
},
{
"id": "TUN",
"value": 74883,
"pop": 172000000
},
{
"id": "SEN",
"value": 27422,
"pop": 267000000
},
{
"id": "CIV",
"value": 70052,
"pop": 165000000
},
{
"id": "AGO",
"value": 41186,
"pop": 267000000
}
]
}
],
"plotOptions": {
"map": {
"map": "world-small-states",
"normalize": {
"by": "pop",
"per": 1000000,
"label": "per million"
}
}
},
"theme": {
"mode": "light",
"preset": "coastal"
}
}
const chart = new WestCoastCharts(document.querySelector('#chart'), options)
await chart.render()Waiting for the chart.
Open Data & agent view to read this chart through chart.describe().
Read from the running library through its optional agent/describe module. Text, table and JSON share the same snapshot. Demo data only.
$ wcc chart export maps-normalize.json --out maps-normalize.svg --with-tablePublic agent tools 0.2.3, tested with Library 1.1.5; available from the versioned GitHub release and npm. Save a JSON spec first and check the loaded runtime and supported modules before rendering. Command reference
Loading /gallery/maps/normalize/index.md …This example uses Premium modules. Compare licences · Embedding in a distributed product?