<!DOCTYPE HTML><html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://code.highcha...ts.js"</script>
<style>
body {
min-width: 310px;
max-width: 1000px;
height: 400px;
margin: 0 auto;
}
h2 {
font-family: TimeNewRoman;
font-size: 2.5rem;
text-align: center;
}
</style>
</head>
<h2> Welcome !</h2>
<br>
<img src="data:image/png;base64,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" width="20" height="20" align="middle" style="padding-bottom: 12px;">
<span style="font-size:1.0rem;">Time </span>
<span id="time" style="font-size:1.0rem;"></span>
<br>
<br>
<div id="chart-temperature" class="container"></div>
<br>
<br>
<br>
<br>
<div id="chart-humidity" class="container"></div>
<br>
<br>
<br>
<br>
<div id="chart-firstsensor" class="container"></div>
<br>
<br>
<br>
<br>
<div id="chart-secondsensor" class="container"></div>
</body>
<script>
const currentTime = new Date(Date.now()); // UTC
document.write(currentTime.toLocaleTimeString('ro-RO'));
document.write("<BR>");
var offset = new Date().getTimezoneOffset();
document.write(offset);[/b]
[b]var chartT = new Highcharts.Chart({
chart:{ renderTo : 'chart-temperature' },
title: { text: 'Temperatura ' },
series: [{
showInLegend: false,
data: []
}],
plotOptions: {
line: { animation: true,
dataLabels: { enabled: true }
},
series: { color: '#059e8a' }
},
xAxis: { type: 'datetime',
dateTimeLabelFormats: { second: '%H:%M:%S' }
},
yAxis: {
title: {text: 'Temperatura (*C)' }
},
credits: { enabled: false }
});
setInterval(function ( ) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var x = (new Date()).getTime() + 1000 * 60 * 60 * 3,
y = parseFloat(this.responseText);
if(chartT.series[0].data.length > 12) {
chartT.series[0].addPoint([x, y], true, true, true);
} else {
chartT.series[0].addPoint([x, y], true, false, true);
}
}
};
xhttp.open("GET", "/temperature", true);
xhttp.send();
}, 3000 ) ;[/b]
[b]var chartH = new Highcharts.Chart({
chart:{ renderTo:'chart-humidity' },
title: { text: 'Umiditate aer ' },
series: [{
showInLegend: false,
data: []
}],
plotOptions: {
line: { animation: false,
dataLabels: { enabled: true }
}
},
xAxis: {
type: 'datetime',
dateTimeLabelFormats: { second: '%H:%M:%S' }
},
yAxis: {
title: { text: 'Umiditate(%)' }
},
credits: { enabled: false }
});
setInterval(function ( ) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var x = (new Date()).getTime() + 1000 * 60 * 60 * 3,
y = parseFloat(this.responseText);
if(chartH.series[0].data.length > 12) {
chartH.series[0].addPoint([x, y], true, true, true);
} else {
chartH.series[0].addPoint([x, y], true, false, true);
}
}
};
xhttp.open("GET", "/humidity", true);
xhttp.send();
}, 3000 ) ;
var chartA = new Highcharts.Chart({
chart:{ renderTo : 'chart-firstsensor' },
title: { text: 'Umiditate sol ( Senzor 1 ) ' },
series: [{
showInLegend: false,
data: []
}],
plotOptions: {
line: { animation: true,
dataLabels: { enabled: true }
},
series: { color: '#059e8a' }
},
xAxis: { type: 'datetime',
dateTimeLabelFormats: { second: '%H:%M:%S' }
},
yAxis: {
title: { text: 'Umiditate (%)' }
},
credits: { enabled: false }
});
setInterval(function ( ) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var x = (new Date()).getTime() + 1000 * 60 * 60 * 3,
y = parseFloat(this.responseText);
if(chartA.series[0].data.length > 12) {
chartA.series[0].addPoint([x, y], true, true, true);
} else {
chartA.series[0].addPoint([x, y], true, false, true);
}
}
};
xhttp.open("GET", "/firstsensor", true);
xhttp.send();
}, 3000 ) ;
var chartB = new Highcharts.Chart({
chart:{ renderTo:'chart-secondsensor' },
title: { text: 'Umiditate sol ( Senzor 2 ) ' },
series: [{
showInLegend: false,
data: []
}],
plotOptions: {
line: { animation: false,
dataLabels: { enabled: true }
}
},
xAxis: {
type: 'datetime',
dateTimeLabelFormats: { second: '%H:%M:%S' }
},
yAxis: {
title: { text: 'Umiditate(%)' }
},
credits: { enabled: false }
});
setInterval(function ( ) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var x = (new Date()).getTime() + 1000 * 60 * 60 * 3,
y = parseFloat(this.responseText);
if(chartB.series[0].data.length > 12) {
chartB.series[0].addPoint([x, y], true, true, true);
} else {
chartB.series[0].addPoint([x, y], true, false, true);
}
}
};
xhttp.open("GET", "/secondsensor", true);
xhttp.send();
}, 3000 ) ;
</script>
</html> 
Sign In
Create Account
0
Posted 03 June 2020 - 10:56
) imi asum asta .
Back to top
Ora implicita a Forumului Softpedia este ora standard a Romaniei (GMT+2). Mai multe informatii →