popov/iot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added EspEasy (garden) handlers.

Browse Source 
Added garden chart;
GetDevice messages has days filter;
Fixed charts & newchart data added.
This commit is contained in:
d-popov
2020-05-12 20:43:28 +03:00
parent d8a37e4b44
commit 8a68a07112
8 changed files with 348 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
views/chartGarden.ejs Normal file
View File

@@ -0,0 +1,180 @@
<div id="chartContainer" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<%- contentFor('head') %>
<script>
var current;
window.onload = function () {
var temp = {in:[], out:[]};
var hum = {in:[], out:[],outSoil:[]};
var press = {out:[]};
/*{ x: new Date(2017, 0, 3), y: 650 },
{ x: new Date(2017, 0, 4), y: 700 },
*/
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
theme: "light2",
zoomEnabled: true,
zoomType: "x",
exportEnabled: true,
title: {
text: "Weather conditions in the lasts 7 days"
},
/* subtitles:[{
text: "X Axis scale is Logarithmic",
fontSize: 14
}],*/
toolTip: {
shared: true
},
legend: {
cursor: "pointer",
verticalAlign: "bottom",
horizontalAlign: "left",
dockInsidePlotArea: true,
itemclick: toogleDataSeries
},
axisX: {
valueFormatString: "HH:mm DD MMM",
crosshair: {
enabled: true,
snapToDataPoint: true
}
},
axisY: [
{
title: "Air Temperature",
lineColor: "#C24642",
titleFontColor: "#C24642",
labelFontColor: "#C24642",
suffix: " °C",
minimum: -10,
// maximum: 40,
} , {
title: "ATM Pressure",
lineColor: "#A477C6",
titleFontColor: "#A477C6",
labelFontColor: "#A477C6",
suffix: "hPa",
minimum: 990,
//maximum: 1080,
},
],
axisY2: [
{
title: "Relative Humidity",
titleFontColor: "#51CDA0",
labelFontColor: "#51CDA0",
minimum: 0,
maximum: 100,
suffix: "%",
}
],
data: [{
name: "Out Temperature",
type: "line",//line
showInLegend: true,
markerType: "square",
xValueFormatString: "HH:mm on DD MMM, YYYY",
color: "#F08080",
dataPoints: temp.out
},
{
name: "In Temperature",
type: "line",//line
showInLegend: true,
//markerType: "square",
//xValueFormatString: "HH:mm on DD MMM, YYYY",
color: "#92D050",
dataPoints: temp.in
},
{
name: "ATM Pressure",
axisYIndex: 1,
type: "line",
showInLegend: true,
lineDashType: "dash",
color: "#A477C6",
dataPoints: press.out
},
//----- sright axies -----
{
name: "Air RH",
axisYType: "secondary",//at right
//axisYIndex: 1,
type: "spline",
showInLegend: true,
lineDashType: "dash",
dataPoints: hum.out
},
{
name: "Soil RH",
axisYType: "secondary",
axisYIndex: 1,
type: "spline",
showInLegend: true,
lineDashType: "dash",
color: "#99D9EA",
dataPoints: hum.outSoil
}]
});
function toogleDataSeries(e) {
if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
e.dataSeries.visible = false;
} else {
e.dataSeries.visible = true;
}
chart.render();
}
function addData(data) {
for (var i = 0; i < data.length; i++) {
var date = new Date(data[i]["timestamp"]);
if (data[i].field_name == "A23_Garden_dht") {
var dht = JSON.parse(data[i].field_value);
hum.out.push({ x: date, y: parseFloat(dht.Hum) });
temp.out.push({ x: date, y: parseFloat(dht.Temp) });
press.out.push({ x: date, y: parseFloat(dht.Pres)});
if (dht.Soil) {
hum.outSoil.push({ x: date, y: parseFloat(dht.Soil) });
}
}
var date = new Date(data[i]["timestamp"]);
if(data[i].field_name == "A23_DHT"){
//console.log("Got DHT:" + date);
var dht = JSON.parse(data[i].field_value).dht;
if(dht && dht.hum <= 100){
hum.in.push({
x: date,
y: dht.hum
});
temp.in.push({
x: date,
y: dht.temp
});
}
}
}
chart.render();
/*
$.getJSON("/n/dht?e=now", function(data){
if(data && data.dht){
chart.title.set("text", "Currently " + data.temp + "°C, " + data.hum +"% RH, ATM:" + data.press + "hPa");
}else {
chart.title.set("text", "Weather conditions");
}
});
*/
}
$.getJSON("/n/device/A23_DHT/1", addData);
$.getJSON("/n/device/A23_Garden_dht/1", addData);
}
</script>