gpt4 book ai didi

javascript - 如何删除 Chartjs Radar 中的网格线和网格标签?

转载 作者:搜寻专家 更新时间:2023-11-01 04:48:14 26 4
gpt4 key购买 nike

chartjs 2键入 RADAR,如何删除网格线和网格线标签以使雷达图更类似于下面看到的所需雷达图?

当前:

chartjs radar

期望:

chart js

最佳答案

要删除/减少网格线,您可以将 ticksmaxTicksLimit 属性设置为一个数字(网格线的数量 - < em>approx.) ,就像这样:

scale: {
ticks: {
maxTicksLimit: 3
}
}

奖励:如果您希望移除所有网格线,请将 maxTicksLimit 设置为 0 将不起作用。而是在您的图表选项中添加以下内容:

gridLines: {
display: false
}

要删除网格线标签(刻度),您可以将 display 属性设置为 false 以进行缩放滴答声,因此:

scale: {
ticks: {
display: false
}
}

ᴡᴏʀᴋɪɴɢ ᴇxᴀᴍᴘʟᴇ⧩

let ctx = document.querySelector('#canvas').getContext('2d');
let chart = new Chart(ctx, {
type: 'radar',
data: {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'],
datasets: [{
label: 'RADAR 1',
data: [3, 1, 6, 4, 7, 5, 4],
backgroundColor: 'rgba(0,119,204,0.2)',
borderColor: 'rgba(0,119,204, 0.5)'
}, {
label: 'RADAR 2',
data: [4, 2, 3, 6, 1, 7, 5],
backgroundColor: 'rgba(255, 0, 0 ,0.2)',
borderColor: 'rgba(255, 0, 0 ,0.5)'
}]
},
options: {
scale: {
ticks: {
display: false,
maxTicksLimit: 3
}
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>
<canvas id="canvas"></canvas>

关于javascript - 如何删除 Chartjs Radar 中的网格线和网格标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45725112/

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