apexcharts

Apexcharts - Label colours do not match


I've assigned three different colours to the labels, but the colour dots always show up as Blue, Green and Yellow. I'm pretty sure I've done something wrong.

The code I've written is:

var pieSimpleChart = {
  chart: {
    height: 350,
    type: 'pie',
  },
  legend: {
    position: 'bottom'
  },
  labels: ["IT", "Product Development", "Sales"],
  series: [2, 2, 6],
  fill: {
    colors: ["#447b40", "#cc7870", "#e74ce4"]
  }
}

var chart = new ApexCharts(document.querySelector("#task-pie-chart"), pieSimpleChart);
chart.render();

enter image description here

How can I match the labels to my selected colours?


Solution

  • I fixed it by removing "fill" option. Now code looks like:

        var pieSimpleChart = 
        {
            chart: 
            {
                height: 350,
                type: 'pie',
            },
            legend: 
            {
                position: 'bottom'
            },
            labels: ["IT", "Product Development", "Sales"],
            series: [2, 2, 6],
            colors: ["#447b40", "#cc7870", "#e74ce4"]
        }