Я знаю, что эта проблема может повториться, но я не могу обновить свои графики с помощью Chart.js. Мне нужен доступ к API каждые 30 секунд, и по истечении этого времени данные на моем графике обновляются
С помощью приведенного ниже кода я смог обновить свой div, но график больше не генерируется. Мне нужно перезагрузить страницу, чтобы иметь возможность сгенерировать новый график, а я этого не хочу. Мне нужно каждые 30 секунд обновлять диаграмму из данных API чтения.
index.html
{% block content %}
<div id="auto" class="row">
{% for row in list %}
<div class="col-xs-6 col-md-4">
<div class="card">
<h5 class="card-header">{{row.description}}</h5>
<canvas id="myChart-{{ forloop.counter }}" class="piechart"></canvas>
<a href="{% url 'row_details' pk=row.pk %}" class="btn botao-detalhar">Detalhar</a>
</div>
</div>
{% endfor %}
</div>
{% endblock content %}
scripts.js
<script>
$(document).ready( function(){
refresh();
});
window.onload = function() {
var endpointTemp = '/api/wd/t/1/'
$.ajax({
method: "GET",
url: endpointTemp,
success: function(data){
var row = []
var value = []
row = data.row
value = data.value
generateGaugeCharts(row, value)
},
error: function(error_data){
console.log("error")
console.log(error_data)
}
})
}
function refresh() {
setTimeout( function() {
$('#piechart').fadeOut('slow').fadeIn('slow');
refresh();
}, 2000);
}
</script>
Как он закодированстраница обновляется по мере необходимости, но моя графика не обновляется новыми данными, полученными с помощью API var endpointTemp =/api/ wd/t/1/