fix(dashboard): extract labels/data from tuple list for Chart.js
This commit is contained in:
@@ -77,29 +77,24 @@
|
|||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
(function() {
|
(function() {
|
||||||
var labels, data, colors, elId;
|
var labels = {{ sent_country_stats|map(attribute=0)|list|tojson }};
|
||||||
{% for stat in sent_country_stats %}
|
var data = {{ sent_country_stats|map(attribute=1)|list|tojson }};
|
||||||
labels = {{ stat.labels|tojson }};
|
if (labels.length) {
|
||||||
data = {{ stat.data|tojson }};
|
new Chart(document.getElementById('chart-sent'), {
|
||||||
colors = labels.map(function(l) { return '#f59e0b'; });
|
type: 'bar',
|
||||||
elId = 'chart-sent';
|
data: { labels: labels, datasets: [{ data: data, backgroundColor: '#f59e0b', borderRadius: 4 }] },
|
||||||
new Chart(document.getElementById(elId), {
|
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
|
||||||
type: 'bar',
|
});
|
||||||
data: { labels: labels, datasets: [{ data: data, backgroundColor: colors, borderRadius: 4 }] },
|
}
|
||||||
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
|
var rlabels = {{ received_country_stats|map(attribute=0)|list|tojson }};
|
||||||
});
|
var rdata = {{ received_country_stats|map(attribute=1)|list|tojson }};
|
||||||
{% endfor %}
|
if (rlabels.length) {
|
||||||
{% for stat in received_country_stats %}
|
new Chart(document.getElementById('chart-received'), {
|
||||||
labels = {{ stat.labels|tojson }};
|
type: 'bar',
|
||||||
data = {{ stat.data|tojson }};
|
data: { labels: rlabels, datasets: [{ data: rdata, backgroundColor: '#8b5cf6', borderRadius: 4 }] },
|
||||||
colors = labels.map(function(l) { return '#8b5cf6'; });
|
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
|
||||||
elId = 'chart-received';
|
});
|
||||||
new Chart(document.getElementById(elId), {
|
}
|
||||||
type: 'bar',
|
|
||||||
data: { labels: labels, datasets: [{ data: data, backgroundColor: colors, borderRadius: 4 }] },
|
|
||||||
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
|
|
||||||
});
|
|
||||||
{% endfor %}
|
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|||||||
Reference in New Issue
Block a user