Multiple Band in JavaScript

var options = {
  series: [68, 82, 54, 91],
  chart: {
    height: 350,
    type: 'radialBar',
  },
  plotOptions: {
    radialBar: {
      dataLabels: {
        name: {
          fontSize: '22px',
        },
        value: {
          fontSize: '16px',
        },
        total: {
          show: true,
          label: 'Average',
          formatter: function (w) {
            // custom formatter: rounded average across all series, with a unit
            var total = w.globals.seriesTotals.reduce(function (a, b) {
              return a + b
            }, 0)
            return Math.round(total / w.globals.series.length) + '%'
          },
        },
      },
    },
  },
  labels: ['North', 'South', 'East', 'West'],
}

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