I want to count the number of companies in companytype model and show that in pie chart. The count should by the name field in company table.
eg: If Company Type is medical and there are 4 companies in that category then i want to show its count on pie chart.
models.py
class CompanyType(models.Model):
company_type = models.CharField(max_length=100)
is_active = models.BooleanField(default=True)
created_at = models.DateField(auto_now_add=True)
updated_at = models.DateField(auto_now=True)
class Company(models.Model):
name = models.CharField(max_length=100)
address = models.TextField()
company_type = models.ForeignKey(CompanyType,on_delete=models.CASCADE)
is_active = models.BooleanField(default=True)
views.py
def index(request):
labels = []
data = []
queryset = Company.objects.values('company_type__company_type').annotate(company_type_sum=Count('name')).order_by('-company_type_sum')
for entry in queryset:
labels.append(entry['company_type__company_type'])
data.append(entry['company_type_sum'])
context = {
'labels':labels,
'data':data,
}
return render(request,'index.html',context)
I have taken Chartjs code from index.html file if there is something wrong.
index.html
<script>
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'pie',
data: {
labels: [data.labels],
datasets: [{
label: 'Companies in Particular Section',
data: [data.data],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});
</script>
You are putting your data in arrays in your views.py but then also make it an array in your new Chart, this 2D array is not being liked by chart.js, changing your new Chart to this should fix the issue:
new Chart(ctx, {
type: 'pie',
data: {
labels: data.labels, // Remove double array
datasets: [{
label: 'Companies in Particular Section',
data: data.data, // Remove double array
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
}
});
On a side note, the pie chart does not have a y scale so you will get ugly lines behind your pie if you keep it in your options, removing it will make your chart look a lot better