Accepted answer

You can configure this using the maxRotation property of the common tick configuration object.

Your code needs to be modified like so:

options: {
  scales: {
    xAxes: [{
      ticks: {
        maxRotation: 90
    yAxes: [{


The keyword of the issue is not rotation i think, it is Tick on xAxes. I think this link can help you :


Chart.js: evenly distribute ticks when using maxTicksLimit

xAxes: [{
    ticks: {
        autoSkip: false, // Skip or not?
        maxTicksLimit: 30 // How much?

and rotation just can help as @timclutton said here :

Related Query

More Query from same tag