feat(dashboard): change country charts from bar to pie with legend
This commit is contained in:
@@ -78,22 +78,22 @@
|
|||||||
<script>
|
<script>
|
||||||
{% if sent_country_stats %}
|
{% if sent_country_stats %}
|
||||||
new Chart(document.getElementById('chart-sent'), {
|
new Chart(document.getElementById('chart-sent'), {
|
||||||
type: 'bar',
|
type: 'pie',
|
||||||
data: {
|
data: {
|
||||||
labels: [{% for code, _ in sent_country_stats %}'{{ code|flag }} {{ code }}',{% endfor %}],
|
labels: [{% for code, _ in sent_country_stats %}'{{ code|flag }} {{ code }}',{% endfor %}],
|
||||||
datasets: [{ data: [{% for _, count in sent_country_stats %}{{ count }},{% endfor %}], backgroundColor: '#3b82f6', borderRadius: 4, maxBarThickness: 40 }]
|
datasets: [{ data: [{% for _, count in sent_country_stats %}{{ count }},{% endfor %}], backgroundColor: ['#3b82f6','#f59e0b','#10b981','#8b5cf6','#ef4444','#06b6d4','#f97316','#84cc16','#ec4899','#6366f1'] }]
|
||||||
},
|
},
|
||||||
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } }, x: { grid: { display: false } } } }
|
options: { responsive: true, plugins: { legend: { position: 'bottom', labels: { padding: 12, usePointStyle: true } } } }
|
||||||
});
|
});
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if received_country_stats %}
|
{% if received_country_stats %}
|
||||||
new Chart(document.getElementById('chart-received'), {
|
new Chart(document.getElementById('chart-received'), {
|
||||||
type: 'bar',
|
type: 'pie',
|
||||||
data: {
|
data: {
|
||||||
labels: [{% for code, _ in received_country_stats %}'{{ code|flag }} {{ code }}',{% endfor %}],
|
labels: [{% for code, _ in received_country_stats %}'{{ code|flag }} {{ code }}',{% endfor %}],
|
||||||
datasets: [{ data: [{% for _, count in received_country_stats %}{{ count }},{% endfor %}], backgroundColor: '#8b5cf6', borderRadius: 4, maxBarThickness: 40 }]
|
datasets: [{ data: [{% for _, count in received_country_stats %}{{ count }},{% endfor %}], backgroundColor: ['#8b5cf6','#3b82f6','#f59e0b','#10b981','#ef4444','#06b6d4','#f97316','#84cc16','#ec4899','#6366f1'] }]
|
||||||
},
|
},
|
||||||
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } }, x: { grid: { display: false } } } }
|
options: { responsive: true, plugins: { legend: { position: 'bottom', labels: { padding: 12, usePointStyle: true } } } }
|
||||||
});
|
});
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user