score:3

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: [{
      ...

score:-1

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

https://www.chartjs.org/docs/latest/axes/styling.html#tick-configuration

also

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 : https://stackoverflow.com/a/58275468/7514010


Related Query

More Query from same tag