var options = {
  series: [4700, 1480, 1030, 740, 45],
  chart: {
    type: 'unit',
    height: 470,
    animations: {
      enabled: true,
      speed: 900,
    },
  },
  labels: ['Asia', 'Africa', 'Americas', 'Europe', 'Oceania'],
  colors: ['#1565C0', '#00B8D9', '#00A96E', '#FFAB00', '#FF4560'],
  plotOptions: {
    unit: {
      layout: 'custom',
      // One of the shapes in apexcharts/unit-shapes.
      positions: 'globe',
      transition: 'flow',
      // Values are millions of people, so one dot stands for ten of them.
      unitValue: 10,
      clusterLabels: {
        show: false,
      },
    },
  },
  legend: {
    position: 'bottom',
  },
}

var chart = new ApexCharts(document.querySelector('#chart'), options)
chart.render()
Globe Population - JavaScript Unit Charts | ApexCharts.js | ApexCharts.js