score:131

Accepted answer

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 :

enter image description here

score:-1

try this simple solution:

mychart.options.scales.yaxes[0].ticks.fontsize = 40 ;

mychart.update();

score:0

try this

chart.defaults.global.defaultfontsize = 8;

score:0

currently, i'm using ^2.9.4 chart.js. i've tried other solutions posted here and did some tweak.

    options: {
    scales: {
      yaxes: [{
        ticks: {
          minor: {
             fontsize: 16
          }
        }
      }],
      xaxes: [{
        ticks: {
          minor: {
             fontsize: 16
          }
        }
      }]
     }
   }

score:3

options: {
                  locale: 'fa-ir',
                  responsive: true, // instruct chart js to respond nicely.
                  maintainaspectratio: false, // add to prevent default behaviour of full-width/height 
                        plugins: {
                          legend: {
                              position: 'top',
                              labels: {
                                  font: {
                                    size: 9,
                                    family:'vazir'
                                  }
                             }
                          },
                          title: {
                            display: true,
                            text: chart_info.charttitle,
                            font: {
                                size: 16,
                                family:'vazir'
                            }
                          },
                          tooltip: {
                              bodyfont: {
                                size: 13,
                                family:'vazir'
                              }
                         }
                    },
                    scales: {
                        x: {
                            ticks: {
                                font: {
                                    size: 10,
                                    family:'vazir'
                                }
                            }
                        },
                        y: {
                            ticks: {
                                font: {
                                    size: 10,
                                    family:'vazir'
                                }
                            }
                        }                       
                    }
                }

score:4

try to see if this will work

{
  ...
  scales: {
    xaxes: [{
      fontsize: 40
      ...
    }]
   }
}

it doesn't look like scalefontsize is a valid property.

score:8

try this is working

     options: {
        scales: {
           xaxes: [{
                   ticks: {
                    fontsize: 10
                   }
                  }]
                }
             }

score:27

configuration options and properties for chartjs 3.0 has changed. currently i'm using chartjs 3.1.1. fonts are used as objects now. in order to change font size of x axis ticks you have to use following configuration.

var options = {
    scales: {
        x: {
            ticks: {
                font: {
                    size: 12,
                }
            }
        }
    }
};

checkout this jsfiddle sample.


Related Query

More Query from same tag