Привет. Я пытаюсь добавить новые данные в БД без обновления страницы. Я использую эту библиотеку chartjs-plugin-streaming для потоковой передачи данных.
Я попытался с помощью обратного вызова ajax на мой URL, который называется мой взгляд
Мой взгляд попадает в мой шаблон моей модели.
view.py
def live(request):
queryset = Registro.objects.all()
if request.GET.get('ensayo__exact') is not None:
queryset = queryset.filter(ensayo__exact=request.GET.get('ensayo__exact'))
if request.GET.get('presion') is not None:
queryset = queryset.filter(presion=request.GET.get('presion'))
if request.GET.get('etapa') is not None:
queryset = queryset.filter(etapa=request.GET.get('etapa'))
if request.GET.get('fecha__gte') is not None:
queryset = queryset.filter(fecha__gte=request.GET.get('fecha__gte'))
if request.GET.get('fecha__lte') is not None:
queryset = queryset.filter(fecha__lte=request.GET.get('fecha__lte'))
presion = [str(obj.presion) for obj in queryset]
etapa = [str(obj.etapa) for obj in queryset]
tempin = [str(obj.tempin) for obj in queryset]
fecha = [str(obj.fecha) for obj in queryset]
fecha__gte = [str(obj.fecha) for obj in queryset]
fecha__lte = [str(obj.fecha) for obj in queryset]
id = [int(obj.id) for obj in queryset]
ensayo_id = [int(obj.ensayo_id) for obj in queryset]
context = {
'presion': json.dumps(presion),
'etapa': json.dumps(etapa),
'tempin': json.dumps(tempin),
'fecha': json.dumps(fecha),
'fecha__get': json.dumps(fecha),
'fecha__lte': json.dumps(fecha),
'id': json.dumps(id),
'ensayo_id': json.dumps(ensayo_id)
}
return render(request, 'reporte/live_data.html', context)
и это js-функции, которые я пробовал в моем шаблоне, и холст, которые визуализируют li:
template.html
function update() {
$.get('', '', function() {
return presion = JSON.parse('{{ presion|safe }}')
});
}
function onRefresh(chart) {
chart.config.data.datasets.forEach(function(dataset) {
dataset.data.push({
x: Date.now(),
y: update(),
});
});
}
var color = Chart.helpers.color;
var config = {
type: 'line',
data: {
labels: fecha,
datasets: [{
label: 'Presión (Bar)',
backgroundColor: color(window.chartColors.blue).alpha(0.5).rgbString(),
borderColor: window.chartColors.blue,
data: presion,
fill: true,
}]
},
options: {
title: {
display: true,
text: 'Line chart (hotizontal scroll) sample'
},
scales: {
xAxes: [{
type: 'realtime',
realtime: {
duration: 20000,
refresh: 1000,
delay: 2000,
onRefresh: onRefresh
}
}],
yAxes: [{
scaleLabel: {
display: true,
labelString: 'value'
}
}]
},
tooltips: {
mode: 'nearest',
intersect: false
},
hover: {
mode: 'nearest',
intersect: false
}
}
};
Есть идеи или помощь?