Django и chartjs, Почему я не могу отобразить три одинаковых графика на главной странице
Я хочу отобразить график 3 x на главной странице.
Проблема в том, что отображается только один. Если я удалю первый {% block%} из первого div, график будет отображаться из второго div. Как мне просмотреть все три графика?
Спасибо за каждый ответ.
в base.html
<div class="card1">
{%block chart1%}{%endblock%}
</div>
<div class="card2">
{%block chart2%}{%endblock%}
</div>
<div class="card3">
{%block chart3%}{%endblock%}
</div>
в index.html
{% block chart1 %}
<div class="charts">
<canvas id="myChart"></canvas>
<script>
const ctx = document.getElementById('myChart');
const myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: [
{% for x in data %}'{{ x.name }}',{% endfor %},
{% for y in data %}'{{ y.numbers }}',{% endfor %},],
datasets: [{
label: '# of Votes',
data: [
{% for x in data %}{{ x.name2 }},{% endfor %},
{% for y in data %}{{ y.name2 }},{% endfor %}],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
],
borderWidth: 5
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});
</script>
</div>
{% endblock chart1 %}
{% block chart2 %}
Here's the code from chart1
{% endblock chart2%}
{% block chart3 %}
Here's the code from chart1
{% endblock chart3%}