Sur ce graphique, La Pression atmosphérique relative j'ai utilisé les dernières librairies Highcharts.
Les nouvelles possibilités sont immenses.
J'ai en particulier, splitté l'info bulle. C'est a dire que chaque séries à sa propre info bulle
Du coup, on peut même y insérer du graphisme (remarquez la petite flèche dans le tooltip de la série Tendance).
En fait, maintenant, on peut déterminer le tooltip de chaque série dans le code même de la série.
Il est même possible maintenant de faire des dégradés de couleur, avec plus de 2 couleurs dans les graphiques de type areaxxxx
Mais ça fait plus d'un mois que je cherchait une solution à un problème . Le changement d'heure
En effet, la plupart d'entre nous, pour déterminer la valeur du TimeStamp en heure locale se serve de cette fonctions PHP.
Code : Tout sélectionner
if (date("I",time())==0) {
$time[$i]=($list['tstamp']+3600)*1000;
}
else {
$time[$i]=($list['tstamp']+7200)*1000;
}
Or le problème est que Highcharts pour les données de type datetime de l'axe xAxis n'accepte pas les doublons.
Le résultat est que Highcharts supprime simplement une série de données.
Pour vous en convaincre, allez sur ce graphique Radiations Solaire et Index UV
A l'aide du sélecteur de date, sélectionnez le 28/10/2018 au 29/10/2018 agrandissez au maximum la période entre 00h00 et 04h00 et vous pourrez constater que l'on ne retrouve pas le changement d'heure.
Maintenant, faite de même avec mon nouveau graphique;
Et là, miracle les deux séries de données lors du changement d'heure apparaissent.
Ceci est possible grâce à une nouvelle fonction time et en particulier du paramètre timezone.
Auparavant, le timezone était déterminé dans la section Global. et concernait la totalité du graphique. Ça n'est plus le cas et sur un même graphique, avec plusieurs conteneurs, on peut déterminer un timezone pour chaque conteneur.
Avec cette nouvelle fonction, plus besoin de calculer le temps en heure locale. On se sert directement du tstamp de nos bases de données (moins de calcul, donc extraction des données accélérées).
Je n'arrivait pas également à afficher le temps en heure locale dans le tooltip.
C'est facile à faire pour l'affichage des labels de l'xAxis mais plus corsé pour le tooltip qui restait désespérément en heure UTC.
C'est alors que
Code : Tout sélectionner
headerFormat:'<span style="font-size:12px"><b>{point.x:%A %e %B %Y à %Hh %Mmn}</b></span><br/>',
C'est ce petit truc combiné au timezone qui résous le problème.
J'ai également ajouté une fonction qui s’exécute au chargement et à chaque changement de zoom du graphique et qui affiche sous le graphique le valeurs extrêmes de la partie affichée. Plus besoin de bouton Afficher les valeurs extrêmes
Je reste à votre disposition pour plus d'info.
A+
Pascal