gpt4 book ai didi

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

转载 作者:行者123 更新时间:2023-11-28 03:29:48 27 4
gpt4 key购买 nike

我有一个折线图,首先,x 轴上的所有标签都是完全水平的。像这样的东西: enter image description here

现在如果添加更多数据,标签开始旋转:

enter image description here

直到达到它可以旋转的最大程度:

enter image description here

从表面上看,我认为最大度数是 45。所以现在,如果我添加更多的数据,而不是更多地旋转标签,它会删除两个标签中的每一个,并变成这样:

enter image description here

如何将此 Angular 增加到 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'
}
}
});

最佳答案

您可以使用 common tick configuration objectmaxRotation 属性进行配置。 .

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

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

关于javascript - ChartJS - 如何增加 x 轴上标签旋转的最大度数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58274212/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com