gpt4 book ai didi

javascript - 有没有办法在圆环 Chart.JS 中显示 100 中的 %

转载 作者:行者123 更新时间:2023-12-04 16:11:45 25 4
gpt4 key购买 nike

我有一个显示数字的圆环图。然而,有没有一种方法可以使圆环图超出 100%,因此我在 data 部分中给出的数字:比如说 21,将显示 21% 的完成情况100?

显示预期结果的图像: donut chart

因此, donut 环呈灰色,彩色部分是已完成的数量(或者我们分配给 data 部分的数字,我一直在查看文档,但看不到这可以做到吗?

我目前拥有的代码:

<canvas id="Chart1" style="width=5 height=5"></canvas>
<?php
$var = 3;
?>

var ctx = document.getElementById('Chart1').getContext('2d');
var chart = new Chart(ctx, {
// The type of chart we want to create
type: 'doughnut',

// The data for our dataset
data: {
labels: ['% Complete'],
datasets: [{
label: 'chart1',
backgroundColor: 'rgb(102, 178, 255)',
borderColor: 'rgb(102, 178, 255)',
// Below I just pull out 1 number from the db
data: [<?php echo $var ?>]
}]
},
});

我的代码输出以下内容(因此 3 填满了整个 donut ),而我希望它显示 100% 完成中的 3%。

chart

最佳答案

尝试传递 [3, 97] 的数据。您尝试将其用作加载指示器,但它似乎是为显示 100% 分解的事物而设计的。

如果您仅传递 [3],那么这就是您的数据集的 100%

关于javascript - 有没有办法在圆环 Chart.JS 中显示 100 中的 %,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60935042/

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