Polar Area Chart

Polar area charts are similar to pie charts, but each segment has the same angle.

Chart.js example

new Chart(document.getElementById("chartjs-polar-area"), {
  type: "polarArea",
  data: {
    labels: ["Speed", "Reliability", "Comfort", "Safety", "Efficiency"],
    datasets: [{
      label: "Model S",
      data: [35, 38, 65, 70, 24],
      backgroundColor: [
        window.theme.primary,
        window.theme.success,
        window.theme.danger,
        window.theme.warning,
        window.theme.info
      ]
    }]
  }
});

ApexCharts example

WARNING

This feature is only available in AdminKit PRO. Learn more.

var options = {
  series: [14, 23, 21, 17, 15, 10, 12, 17, 21],
  chart: {
    height: 350,
    type: 'polarArea',
  },
  stroke: {
    colors: ['#fff']
  },
  fill: {
    opacity: 0.8
  },
  responsive: [{
    breakpoint: 480,
    options: {
      chart: {
        width: 200
      },
      legend: {
        position: 'bottom'
      }
    }
  }]
};

var chart = new ApexCharts(document.querySelector("#apexcharts-polar-area"), options);
chart.render();