j'ai un problème avec l'actualisation de données automatiquement du graphe hightcharts, j'ai adapté un code hightcharts pour mon application, ça marche il fonctionne correctement le code est le suivant:
<?php
//Connexion a la base de données
// Remplacer localhost, highcharts, username, password, par vos informations de connexion.
$hostname = "localhost";
$database = "test";
$username = "root";
$password = "*******";
$Conn = mysql_pconnect($hostname, $username, $password);
mysql_select_db($database, $Conn);
$query_conso = "SELECT P FROM `pvt`";
$conso = mysql_query($query_conso, $Conn);
$row_conso = mysql_fetch_assoc($conso);
$mysql_select_db($database, $Conn);
$query_date = "SELECT Date FROM `pvt`";
$date = mysql_query($query_date, $Conn);
$row_date = mysql_fetch_assoc($date);
?>
<html>
<head>
<title> teste avec notre base mysql</title>
<!-- Chargement des librairies: Jquery & highcharts -->
<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/themes/gray.js" ></script>
<script type="text/javascript" src="js/modules/exporting.js" ></script>
</head>
<body>
<p>
<!-- Chargement des variables, et paramètres de Highcharts -->
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
zoomType: 'x',
spacingRight: 20
},
title: {
//Titre du graphique
text: 'ssanino'
},
subtitle: {
//date("d/m/Y - H:i", strtotime($row_date['Date'])) permet la mise en forme de la date:
//Dans le cas actuel: Jour / mois / Année - Heure : Minutes
text: 'Dernier enregistrement: <?php echo date("d/m/Y - H:i", strtotime($row_date['Date'])); ?> <br/>Vous pouvez effectuer un zoom sur le graphique en maintenant le clique gauche souris sur une zone du graphique'
},
xAxis: {
tickmarkPlacement: 'on',
//Affichage des dates précédemment sélectionnées dans la requete sql
categories : [<?php do { ?>'<?php echo date("H:i", strtotime($row_date['Date'])); ?>', <?php } while ($row_date = mysql_fetch_assoc($date)); ?>],
labels: {
//Step 2 permet d'afficher qu'une date sur deux
step: 2,
//rotation 90 permet la rotation a 90° des dates
rotation: 45
}
},
yAxis: {
title: {
text: 'P (jW)'
}
},
tooltip: {
shared: true,
//Ajout d'une unité de mesure lors du survole d'un point du graphique
valueSuffix: ' jW'
},
legend: {
//Legend permet d'afficher la légende sous le graphique.
//La légende affiche, le nom de la courbe, ainsi que sa couleur
//Pas forcément utile lorsqu'il n'y a qu'une seule courbe
//false pour désactiver et true pour activer
enabled: false
},
plotOptions: {
area: {
fillColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
lineWidth: 1,
marker: {
enabled: false
},
shadow: false,
states: {
hover: {
lineWidth: 3
}
},
threshold: null
}
},
series: [{
type: 'area',
name: 'P',
//Affichage des consommations précédemment sélectionnées dans la requete sql
data: [<?php do { ?><?php echo $row_conso['P']; ?>,<?php } while ($row_conso = mysql_fetch_assoc($conso)); ?>]
}]
});
});
</script>
<!-- Affichage du graphique -->
<div id="container" style="width:100%; height:400px;">
</div></p>
<div align="center">
<p><a </a></p>
</div>
</body>
</html>
j'ai besoin d'aide merci
mais je te promet qu'après avoir terminer la rédaction du tutoriel actuel je vais voir si je peut écrire un tutoriel sur le sujet.