ChartJS - x 轴标签方向

Question

是否可以像屏幕截图上的标记区域一样更改 x 轴 label 方向？ 我正在尝试使用afterCalculateTickRotation旋转标签，但它们没有被翻转。 镜像选项也不起作用。

示例代码

Answer 1

我设法做到了您的要求，但这并不漂亮，因为 chart.js 缺乏正确执行此操作的支持。 所以我用一些硬编码填充解决了它。 https://codesandbox.io/s/vue-template-4ygr1

这是您应该使用的 minRotation 和 maxRotation 。 当旋转低于零时，标签锚点应该移动，但它们不会。 相反，它们会旋转到图表中，但这可以通过填充来避免。

填充的一个副作用是图例位置坏了，所以我把它放在顶部。

另一个不受欢迎的行为是文本右对齐。 有一个未解决的问题： https://github.com/chartjs/Chart.js/issues/4193