我在 Django views.py 中有一個陣列,我想將它發送到 HTML 并顯示餅圖,但是失敗了,我嘗試了許多其他方法并閱讀了許多教程,在大多數情況下,它們在模型中有一個欄位存盤一些數字,它們會顯示這些數字。就我而言,我需要計算處于不同狀態的任務的小計。如果有任何建議,我不確定如何使用適當的標簽或任何其他餅圖將這些資料輸出到chart.js?

視圖.py
def visualisation(request, project_id):
project = Project.objects.get(id=project_id)
counts_data = Todo.objects.aggregate(
to_do_count=Count('id', filter=Q(status='to_do')),
in_progress_count=Count('id', filter=Q(status='in_progress')),
done_count=Count('id', filter=Q(status='done'))
)
return render(request, 'todo_lists/progress.html', {"counts_data": counts_data})
html
<script>
$(document).ready(function() {
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'doughnut',
data: {
labels: [1,2,3],
datasets: [{
label: '# of Votes',
data:{{counts_data}},
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)'
],
borderWidth: 1
}]
},
options: {
responsive:false
}
});
});
</script>

uj5u.com熱心網友回復:
<script>
$(document).ready(function() {
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'doughnut',
data: {
labels: [1,2,3],
datasets: [{
label: '# of Votes',
data:counts_data,
success: function (data){
$('#todocount').html(counts_data.to_do_count);
$('#progress_count').html(counts_data.in_progress_count);
$('#progress_done').html(counts_data.done_count);
}
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)'
],
borderWidth: 1
}]
},
options: {
responsive:false
}
});
});
</script>
uj5u.com熱心網友回復:
您需要以結構化方式為chart.js
Chart JS Data Structures 
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/334383.html
標籤:javascript Python 姜戈
