Chartjs-ChartJS – x axis labels orientation

I managed to do what you are asking for but it’s not beautiful because chart.js lacks support to do it properly. So I solved it with some hard coded padding.
https://codesandbox.io/s/vue-template-4ygr1

It’s the minRotation and maxRotation you should work with. The labels anchoring point should shift when the rotation goes below zero but they don’t. Instead they rotate into the chart but this can be avoided with padding.

A side effect of the padding is that the legend placement broke so i put it in the top instead.

Another unwanted behavior is that the text is aligned to the right. There is an open issue about that: https://github.com/chartjs/Chart.js/issues/4193