ChartJS - 如何增加 x 轴上标签旋转的最大程度？

Question

我有一个折线图，首先，x 轴上的所有标签都是完全水平的。像这样的东西： 现在，如果添加更多数据，标签开始旋转：直到出现一个点，它似乎已经达到了它可以旋转的最大程度：从它的外观来看，我认为最大度数是 45。所以现在，如果我添加更多数据，而不是更多地旋转标签，它会删除两个标签中的每一个，变成这样：我怎样才能将此度数增加到 90，以便标签旋转到完全垂直的程度？这是我用于图表的代码：new Chart(chart, {  type: 'line',  data: chart_data,  options: {    scales: {      yAxes: [{        ticks: {          beginAtZero: false        }      }]    },    legend: {      position: 'top',      labels: {        boxWidth: 5,        usePointStyle: true      }    },    events: ['click', 'mousemove'],    onClick: clicked,    pan: {      enabled: true,      mode: 'x',      onPanComplete: function(event) {        console.log(event)      }    },    zoom: {      enabled: true,      mode: 'x'    }  }});

Answer 1

您可以使用通用配置对象的maxRotation属性进行配置。tick

您的代码需要像这样修改：

options: {

  scales: {

    xAxes: [{

      ticks: {

        maxRotation: 90

      }

    }],

    yAxes: [{

      ...

Answer 2

这个问题的关键词是不旋转，我认为，这是蜱上xAxes。我认为此链接可以帮助您：

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

还

Chart.js：使用 maxTicksLimit 时均匀分布刻度

xAxes: [{

    ticks: {

        autoSkip: false, // Skip or not?

        maxTicksLimit: 30 // How much?

    }

}]

正如@timclutton 在这里所说的那样，旋转可以提供帮助：https ://stackoverflow.com/a/58275468/7514010