我想知道如何通过从温度和湿度图表的随机值中获取数据来更新数据库,并且该值将自动更新并存储具有时间跨度的数据库。
view.py
from django.contrib.auth import get_user_model
from django.http import JsonResponse
from django.shortcuts import render
from django.views.generic import View
from .models import *
import random
from rest_framework.views import APIView
from rest_framework.response import Response
User=get_user_model()
class HomeView(View):
def get(self,request,*args,**kwargs):
return render(request,'charts.html',{})
def get_data(request,*args,**kwargs):
data={
}
return JsonResponse(data)
class ChartData(APIView):
authentication_classes = []
permission_classes = []
def get(self, request, format=None):
qs_count=User.objects.all().count()
labels=["0", "2", "4", "6", "8", "10","12","14","16","18"]
default_items=[]
for items in range(10):
t=random.randint(0,50)
default_items=default_items+[t]
data={
"labels":labels,
"default":default_items,
}
return Response(data)``
chart.html
<meta http-equiv="refresh" content="2">
{% extends 'base.html' %}
<script type="text/javascript">
{% block jquery %}
var endpoint='/api/chart/data/' //{% url "api-data" %}
var defaultData=[]
var labels=[]
$.ajax({
method:'GET',
url:endpoint,
success:function(data) {
labels=data.labels
defaultData=data.default
setChart()
},
error:function(error_data){
console.log(error)
console.log(error_data)
}
})
function setChart(){
var ctx = document.getElementById("Temp");
var ctx2 = document.getElementById("Hmdt");
var Hmdt = new Chart(ctx2, {
type: 'bar',
data: {
labels: labels ,
datasets: [{
label: 'Max Humidity',
data: defaultData,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 2
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
var Temp = new Chart(ctx, {
type: 'line',
data: {
labels: labels ,
datasets: [{
label: 'Max Temperature',
data: defaultData,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 2
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
{% endblock %}
</script>
{% block content %}
<div class="row">
<div class="col-sm-12" url-endpoint='{% url "api-data" %}'>
<h1>This is my charts</h1>
<p id="i2"></p>
<div class="col-sm-6">
<h1 style="text-align: center;">Temperature</h1>
<canvas id="Temp" width="100" height="100"></canvas>
</div>
<div class="col-sm-6">
<h1 style="text-align: center;">Humidity</h1>
<canvas id="Hmdt" width="100" height="100"></canvas>
</div>
</div>
</div>
{% endblock content %}
我想知道如何通过从温度和湿度图表的随机值中获取数据来更新数据库,并且该值将自动更新并存储具有时间跨度的数据库。