gpt4 book ai didi

javascript - 水平条形图的 Chart.js 中 x 轴上的自定义标签/固定范围?

转载 作者:行者123 更新时间:2023-12-05 07:05:27 24 4
gpt4 key购买 nike

我正在尝试为 Chart.JS 中的单个条形图、水平条形图设置固定范围

标签数组只适用于垂直轴,但我想在 X 轴上有一组固定的标签。

示例:https://altonwells.webflow.io/chart-js

var ctx = document.getElementById('SATScoreGraph2').getContext('2d');
var myBarChart = new Chart(ctx, {
type: 'horizontalBar',
data: {
labels: [""],
datasets: [{
barThickness: 48,
barPercentage: 0.7,
categoryPercentage: 1.0,
backgroundColor: ["#ff6f47"],
data: [1480]
}]
},
options: {
indexAxis: 'x',
title: {
display: false,
text: 'Average SAT Score'
},
legend: {
display: true
},
tooltips: {
enabled: false
}
}
});
<html>

<body>
<canvas id="SATScoreGraph2"></canvas>
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
</body>

</html>

最佳答案

阅读文档

https://www.chartjs.org/docs/latest/axes/cartesian/linear.html

options: {
indexAxis: 'x',
title: {
display: false,
text: 'Average SAT Score'
},
legend: {
display: true
},
tooltips: {
enabled: false
},
scales: {
xAxes: [{
ticks: {
suggestedMin: 800,
suggestedMax: 1600
}
}]
}
}

关于javascript - 水平条形图的 Chart.js 中 x 轴上的自定义标签/固定范围?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62743215/

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