Code : Tout sélectionner
<?php
// appel du script de connexion
require("mysql_connect.php");
$sql = "select round(AVG(h_out_moy),2) AS AnneeMois, FROM `MiniMaxidatavp2`";
// Rcupration des donnes en faisant la somme de t_out_moy en crant une variable AnneeMois et en groupant les donnes sur cette variable AnneeMois.
$sql = "SELECT tstamp, AVG(h_out_moy), substr(recdateTZ,1,6) AS AnneeMois FROM `MiniMaxidatavp2` GROUP BY AnneeMois";
$query = mysql_query($sql);
$i=0;
while ($list = mysql_fetch_assoc($query)) {
if (date("I",time())==0) {
$time[$i]=($list['tstamp']+7200)*1000;
}
else {
$time[$i]=($list['tstamp']+7200)*1000;
}
$h_out_moy[$i]=$list['AVG(h_out_moy)']*1;
$i++;
}
?>
<script type="text/javascript">
eval(<?php echo "'var time = ".json_encode($time)."'" ?>);
eval(<?php echo "'var h_out_moy = ".json_encode($h_out_moy)."'" ?>);
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<META NAME="SUBJECT" CONTENT="Graphique Vantage Pro Davis">
<META NAME="DESCRIPTION" CONTENT="graphique dynamique">
<META NAME="KEYWORDS" CONTENT=" M�t�o Jarny (54)">
<META NAME="REVISIT-AFTER" CONTENT="5 DAYS">
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=9" >
<META NAME="LANGUAGE" CONTENT="FR">
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Météo Canéjan</title>
<!-- 1. Add these JavaScript inclusions in the head of your page -->
<script type="text/javascript" src="jquery/jquery.min.js"></script>
<script src="highstock/js/highstock.js"></script>
<script src="highstock/js//highcharts-more.js"></script>
<script src="highstock/js/modules/exporting.js"></script>
<script src="highstock/js/themes/grid.js"></script>
<link rel="stylesheet" href="jquery/development-bundle/themes/base/jquery.ui.all.css">
<script src="jquery/js/jquery-1.9.1.js"></script>
<script src="jquery/development-bundle/ui/jquery.ui.core.js"></script>
<script src="jquery/development-bundle/ui/jquery.ui.widget.js"></script>
<script src="jquery/development-bundle/ui/jquery.ui.datepicker.js"></script>
<script src="jquery/development-bundle/demos/datepicker/jquery.ui.datepicker-fr.js"></script>
<link rel="stylesheet" href="jquery/development-bundle/demos/demos.css">
<script type="text/javascript" src="jquery/overlib.js"></script>
<script type="text/javascript" src="jquery/overlib_fade.js"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet"/>
<style type ='text/css'>
</style> <!--<script src="../highstock/js/themes/gray.js"></script>-->
<!-- 2. Add the JavaScript to initialize the chart on document ready -->
<script type="text/javascript">
function comArr(unitsArray) {
var outarr = [];
for (var i = 0; i < time.length; i++) {
outarr[i] = [time[i], unitsArray[i]];
}
return outarr;
}
$(function () {
var chart;
$(document).ready(function() {
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);
Highcharts.setOptions({
lang: {
months: ["Janvier "," Février "," Mars "," Avril "," Mai "," Juin "," Juillet "," Août "," Septembre "," Octobre "," Novembre "," Décembre"],
weekdays: ["Dim "," Lun "," Mar "," Mer "," Jeu "," Ven "," Sam"],
shortMonths: ['Jan', 'Fev', 'Mar', 'Avr', 'Mai', 'Juin', 'Juil','Août', 'Sept', 'Oct', 'Nov', 'Déc'],
decimalPoint: ',',
resetZoom: 'Réinitialiser le zoom',
resetZoomTitle: 'Réinitialiser le 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",
printButtonTitle: "Imprimer le graphique",
printChart: "Imprimer le graphique",
loading: "Chargement en cours...",
rangeSelectorFrom: "Du",
rangeSelectorTo: "Au"
}
});
window.chart = new Highcharts.StockChart({
chart: {
renderTo: 'container',
zoomType: 'x',
alignTicks: false,
type: 'spline',
marginRight: 20,
marginBottom: 10,
marginTop: 35,
plotBorderColor: '#ff6691',
plotBorderWidth: 1,
borderColor: '#EBBA95',
borderWidth: 1,
plotBackgroundColor: '#F7F8E0',
backgroundColor: '#67C9F1',
},
navigator: {
top: 475
},
title: {
text: 'Humidité moyenne mensuelle',
style:{font: 'bold 14px sans-serif', color: '#000000'},
x: -20 //center
},
subtitle: {
text: 'Source : Météo Canéjan',
align: 'center',
x: 0
},
credits: {
text: ' Météo Canéjan',
href: 'http://meteo-canejan.fr'
},
rangeSelector : {
buttonTheme: { // styles for the buttons
width: 100,
fill: 'white',
stroke: 'none',
'stroke-width': 1,
r: 3,
// style: {
// color: '#0000A0',
// fontWeight: 'bold'
// },
// states: {
// hover: {
// fill: '#FF0000',
// style: {
// color: '#FFFF00'
// }
// },
// select: {
// fill: '#0000A0',
// style: {
// color: 'white'
// }
// }
// }
},
buttons: [{
enabled: false,
type: 'ytd',
count: 1,
text: 'Cette année'
}],
inputEnabled: false,
selected : 0,
},
legend: {
enabled: true,
align: 'top',
layout: 'horizontal',
// verticalAlign: 'top',
// y: 25,
x: 250,
shadow: true
},
xAxis: {
type: 'datetime',
labels: {
format: '{value: %b<br/>%Y}',
align: 'center',
}
},
yAxis: { // 1er yAxis (numero 0)
opposite:false,
showFirstLabel: true,
showLastLabel: true,
labels: {
formatter: function() {
return this.value +' %';
},
align : 'right',
x : -10,
y : 3,
style: {
color: '#FF0000'
}
},
title: {
text: 'Humidité en %',
style: {
color: '#000000'
}
}
},
tooltip: {
crosshairs: true,
borderColor: 'royalblue',
valueDecimals: 1,
shared: true,
backgroundColor: '#F5ECCE',
borderRadius: 5,
formatter: function() {
var s = '<b>'+ Highcharts.dateFormat('%B %Y', this.x) +'</b>';
$.each(this.points, function(i, point) {
var unit = {
'Humidité': ' %',
}[this.point.series.name];
s = s + '<br/>' + '<span style="color:'+ point.series.color +'">' + point.series.name + '</span> : ' +Highcharts.numberFormat(point.y,1,","," ")
+ unit;
});
return s;
},
},
plotOptions: {
series: {
borderWidth: 0.5,
borderColor: 'black'
},
},
series: [{
name: 'Humidité',
id :'Humidité',
tooltip: {
valueDecimals: 1
},
type: 'column',
pointPadding: 0,
pointWidth: 15,
dataLabels: {
enabled: true,
format: '{y} %',
color:'#000000',
x: 0,
y: 0
},
color: '#3F36F2',
data: comArr(h_out_moy),
},
]
},
function(chart) {// on complete
chart.renderer.image('http://www.meteo-canejan.fr/graphique/blason1.png', 10, 3, 43, 50)
.add();
});
});
});
</script>
</head>
<body>
<!-- 3. Add the container -->
<table align="center">
<tr>
<td><div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
<div align="center"></div>
</td>
</tr>
</table>
</body>
</html>
c'est toujours pareil, une question que je me pose, faut t'il que je laisse " AVG(h_out_moy)" dans cette requète vu que je l'ai déja appelé ? :