var options = {
  series: [54, 41, 38, 16, 12],
  chart: {
    width: 480,
    type: 'donut',
  },
  labels: [
    'North America',
    'Europe',
    'Asia Pacific',
    'Latin America',
    'Middle East',
  ],
  title: {
    text: 'Revenue by Region ($M)',
    align: 'center',
  },
  legend: {
    show: false,
  },
  plotOptions: {
    pie: {
      dataLabels: {
        external: {
          show: true,
        },
      },
    },
  },
  responsive: [
    {
      breakpoint: 480,
      options: {
        chart: {
          width: 320,
        },
      },
    },
  ],
}

var chart = new ApexCharts(document.querySelector('#chart'), options)
chart.render()