Chart.js axes label font size

Question

In chart.js how can I set the set the font size for just the x axis labels without touching global config?

I've already tried setting the 'scaleFontSize' option my options object. I've also tried setting:

{
  ...
  scales: {
    xAxes: [{
      scaleFontSize: 40
      ...
    }]
   }
}

Answer 1

Try this is working

     options: {
        scales: {
           xAxes: [{
                   ticks: {
                    fontSize: 10
                   }
                  }]
                }
             }

Answer 2

Try this simple solution:

myChart.options.scales.yAxes[0].ticks.fontSize = 40 ;

myChart.update();

Answer 3

Try to see if this will work

{
  ...
  scales: {
    xAxes: [{
      fontSize: 40
      ...
    }]
   }
}

It doesn't look like scaleFontSize is a valid property.

Answer 4

The fontSize attribute is actually in scales.xAxes.ticks and not in scales.xAxes as you thought.

So you just have to edit the attribute like this :

var options = {
    scales: {
        yAxes: [{
            ticks: {
                fontSize: 40
            }
        }]
    }
}

---

You can see a fully working example in this jsFiddle and here is its result :