Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/434.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript ChartJS-如何增加标签在x轴上的最大旋转度?_Javascript_Chart.js - Fatal编程技术网

Javascript ChartJS-如何增加标签在x轴上的最大旋转度?

Javascript ChartJS-如何增加标签在x轴上的最大旋转度?,javascript,chart.js,Javascript,Chart.js,我有一个折线图,首先,x轴上的所有标签都是完全水平的。大概是这样的: 现在,如果添加更多数据,标签将开始旋转: 直到达到了它可以旋转的最大程度: 从表面上看,我认为最高学位是45。现在,如果我再添加一点数据,而不是更多地旋转标签,它会删除两个标签中的每一个,变成这样: 如何将此度数增加到90,使标签旋转到完全垂直的程度 以下是我用于图表的代码: new Chart(chart, { type: 'line', data: chart_data, options: {

我有一个折线图,首先,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'
    }
  }
});

我认为,问题的关键词不是轮换,而是XAX上的勾号。 我认为此链接可以帮助您:


正如@timclutton在这里所说的那样,旋转可以有所帮助:

您可以使用的
maxRotation
属性来配置它

您的代码需要进行如下修改:

options: {
  scales: {
    xAxes: [{
      ticks: {
        maxRotation: 90
      }
    }],
    yAxes: [{
      ...

所以默认的度数是50!非常感谢。
options: {
  scales: {
    xAxes: [{
      ticks: {
        maxRotation: 90
      }
    }],
    yAxes: [{
      ...