first commit
This commit is contained in:
177
high/TP3.php
Normal file
177
high/TP3.php
Normal file
@ -0,0 +1,177 @@
|
||||
<?php require("database.php"); ?>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<script type="text/javascript" src="js/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/highcharts.js"></script>
|
||||
<script type="text/javascript" src="js/grid.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<?php
|
||||
|
||||
$db->exec('USE texier');
|
||||
|
||||
try {
|
||||
$bdd = $db->query('SELECT max(dateT) from data');
|
||||
} catch (PDOException $e) {
|
||||
print "Erreur SQL !";
|
||||
die();
|
||||
}
|
||||
$list=$bdd->fetch();
|
||||
|
||||
$stop=$list[0];
|
||||
$start=$stop-(86400*2);
|
||||
|
||||
$bdd = $db->query("SELECT dateT, tempExt, humidExt FROM data WHERE dateT >= '".$start."' and dateT <= '".$stop."' ORDER BY dateT");
|
||||
$i=0;
|
||||
while ($list = $bdd->fetch(PDO::FETCH_ASSOC)) {
|
||||
if (date("I",time()) == 0) {
|
||||
$time[$i]=($list['dateT']+3600)*1000;
|
||||
}
|
||||
else {
|
||||
$time[$i]=($list['dateT']+7200)*1000;
|
||||
}
|
||||
|
||||
$tempExt[$i]=$list['tempExt']*1;
|
||||
$humidExt[$i]=$list['humidExt']*1;
|
||||
$i++;
|
||||
}
|
||||
$bdd = null;
|
||||
?>
|
||||
|
||||
<script type="text/javascript">
|
||||
eval(<?php echo "'var dateT = ".json_encode($time)."'" ?>);
|
||||
eval(<?php echo "'var tempExt = ".json_encode($tempExt)."'" ?>);
|
||||
eval(<?php echo "'var humidExt = ".json_encode($humidExt)."'" ?>);
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function comArr(unitsArray) {
|
||||
var outarr = [];
|
||||
for (var i = 0; i < dateT.length; i++) {
|
||||
outarr[i] = [dateT[i], unitsArray[i]];
|
||||
}
|
||||
return outarr;
|
||||
}
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
Highcharts.setOptions({
|
||||
lang: {
|
||||
months: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin',
|
||||
'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'],
|
||||
weekdays: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'],
|
||||
shortMonths: ['Jan', 'Fev', 'Mar', 'Avr', 'Mai', 'Juin', 'Juil','Août', 'Sept', 'Oct', 'Nov', 'Déc'],
|
||||
decimalPoint: ',',
|
||||
resetZoom: 'Ré-initialiser zoom',
|
||||
resetZoomTitle: 'Ré-initialiser zoom à 1:1',
|
||||
downloadPNG: "Télécharger au format PNG image",
|
||||
downloadJPEG: "Télécharger au format JPEG image",
|
||||
downloadPDF: "Télécharger au format PDF document",
|
||||
downloadSVG: "Télécharger au format SVG vector image",
|
||||
exportButtonTitle: "Exporter image ou document",
|
||||
printChart: "Imprimer le graphique",
|
||||
loading: "Chargement...",
|
||||
rangeSelectorFrom: 'Du',
|
||||
rangeSelectorTo: 'au'
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
chart = new Highcharts.Chart({
|
||||
chart: {
|
||||
renderTo: 'graphique',
|
||||
zoomType: 'x',
|
||||
type: 'spline',
|
||||
marginBottom: 70,
|
||||
marginLeft: 80,
|
||||
defaultSeriesType: "spline",
|
||||
alignTicks: false,
|
||||
plotShadow: true,
|
||||
plotBorderColor: '#346691',
|
||||
plotBorderWidth: 1,
|
||||
backgroundColor: {
|
||||
linearGradient: [0, 0, 600, 600],
|
||||
stops: [
|
||||
[0, 'rgb(162, 192, 216)'],
|
||||
[1, 'rgb(255, 255, 255)']
|
||||
]
|
||||
},
|
||||
},
|
||||
|
||||
credits: {
|
||||
text: '© Texier Baptiste',
|
||||
href: ''
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Température',
|
||||
x: -20
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source : Météo',
|
||||
align: 'center',
|
||||
x: -20
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
startOnTick: false,
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Température (°C)'
|
||||
},
|
||||
plotLines: [{
|
||||
value: 0,
|
||||
width: 1,
|
||||
color: '#FF0000'
|
||||
}]
|
||||
},
|
||||
tooltip: {
|
||||
crosshairs:[true],
|
||||
borderColor: '#4b85b7',
|
||||
shared: true,
|
||||
backgroundColor: '#edf1c8',
|
||||
formatter: function() {
|
||||
var s = '<b>'+ Highcharts.dateFormat('%e %B à %H:%M', this.x) +'</b>';
|
||||
$.each(this.points, function(i, point) {
|
||||
var unit = {
|
||||
'Température': ' °C',
|
||||
'Humidité': ' %'
|
||||
}[this.point.series.name];
|
||||
s = s + '<br>' + '<span style="color:'+ point.series.color +'"></span>'+ point.series.name + '<b> : '+Highcharts.numberFormat(point.y,1,","," ")+ '</b>' + unit;
|
||||
});
|
||||
return s;
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'Température',
|
||||
zIndex: 1,
|
||||
color: '#FF0000',
|
||||
data: comArr(tempExt)
|
||||
},
|
||||
{
|
||||
name: 'Humidité',
|
||||
color: '#BD005C',
|
||||
dashStyle: 'ShortDash',
|
||||
data: comArr(humidExt)
|
||||
}
|
||||
]
|
||||
})
|
||||
});
|
||||
|
||||
</script>
|
||||
<br>
|
||||
<center>
|
||||
<h1>TP Texier</h1>
|
||||
</center>
|
||||
<br>
|
||||
<div id="graphique" style="width: 550px; height:300px; margin: 0 auto;"></div>
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user