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>
comme j'ai déjà dit mes données dans une base de données mysql ils sont dynamique avec le temps, je veut que mon graphe aussi etre dynamique avec le changement de données source, j'ai trouvé plusieurs solution sur web (Ajax particulièrement) mais j'ai pas arrivé a comprendre le principe de fonctionnement de cette bibliothèque, commet je peut actualiser une partie de mon script php, bien sur le commande select from chaque période de tempsj'ai besoin d'aide merci