Search code examples
amcharts4

AmCharts 4: change categoryAxis color by using fill property


I have an amCharts 4 column chart and I'm trying to set the category name to white because my background color page is dark blue, but when I use categoryAxis.fill = am4core.color("#FFFFFF") it does not change the color to white, it keeps it black, but when I try to change the stroke color using categoryAxis.stroke = am4core.color("#FFFFFF") it changes its stroke color perfectly.

Why when I use .fill it does not work?

Here is my categoryAxis definition. What am I doing wrong?

 var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
 categoryAxis.dataFields.category = "category";
 categoryAxis.renderer.grid.template.location = 0;
 categoryAxis.fill = am4core.color("#FFFFFF");
 categoryAxis.stroke = am4core.color("#FFFFFF");
 categoryAxis.renderer.minGridDistance = 30;
 categoryAxis.renderer.grid.template.disabled = true;
 categoryAxis.renderer.cellStartLocation = 0.05
 categoryAxis.renderer.cellEndLocation = 0.95
 categoryAxis.renderer.fontSize = 15;

Solution

  • I have just found out what fix my problem. But I'm not using categoryAxis.fill anymore.

    I set up classes to the amCharts elements using

    am4core.options.autoSetClassName = true;
    

    and set up this css on my page

     g.amcharts-AxisLabel-group {
            fill: #FFFFFF !important;
     }