Page 1 sur 1

Les dernières librairies Highcharts

Posté : 02 déc. 2018, 20:24
par PascalWMR
Bonjour

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 :( :x . 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;
  } 
Le problème de notre méthode, est que lors du changement d'heure lors du passage de l'heure d'été à l'heure d'hiver, nous créons deux séries de données timestamp identiques puisque à 03h00 locale il est à nouveau 02h00 locale.
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à, :idea: :idea: :idea: miracle les deux séries de données lors du changement d'heure apparaissent. :mrgreen: :P

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.
:idea: :idea: :idea: C'est alors que :ugeek:

Code : Tout sélectionner

headerFormat:'<span style="font-size:12px"><b>{point.x:%A %e %B %Y à %Hh %Mmn}</b></span><br/>',
et ça, c'est fait pour les chiens :?: :?: :?:
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

Re: Les dernières librairies Highcharts

Posté : 02 déc. 2018, 21:09
par Javier
Saludos Pascal

J'ai trouvé tes explications sur les nouvelles librairies Highcharts très intéressantes.
Ton graphique de pression et sa tendance sont spectaculaires; J'ai été particulièrement frappé, pour la possibilité de joindre une image qui change dans l'info bulle.
Fait intéressant, les librairies Amcharts peuvent depuis longtemps changer de couleur dans l'info bulle en fonction de l'évolution de la valeur (visible dans les valeurs de température):

http://kocher.es/graficos-amchart/temp- ... aro-gw.php

Je reconnais qu'en ce qui concerne le format du temps, je suis totalement perdu.

Félicitations pour ce magnifique exemple de graphique dynamique.

Salutations de votre admirateur et ami débutant d'Espagne

Javier

Re: Les dernières librairies Highcharts

Posté : 03 déc. 2018, 12:04
par jturlier
Trop beau !!!
Je vais me pencher dessus !
Merci pour ces nouvelles idées.
Amitiés
Jean

Re: Les dernières librairies Highcharts

Posté : 16 sept. 2019, 17:56
par kekedou
Bonjour à tous!
De retour après une absence bien involontaire, je jette un oeil sur mon site et je constate que le graphique de la pression atmosphérique relative
n'affiche pas les données.
https://www.lafrancaise-meteo.fr/graphd ... n6mois.php
Celles-ci sont pourtant bien présentes car bien extraites et elles s'affichent dans les différents tooltips.
La même chose se passe sur le même graphique de PascalWMR, https://www.monsite-meteo.eu/Page/graph ... n6mois.php
Y-a-t-il un lien avec es librairies highcharts? il y a une erreur:
Highcharts error #25: www.highcharts.com/errors/25
highstock.src.js:467 Highcharts: Deprecated option chart.description used. Use accessibility.description instead
Au plaisir de vous lire
Jean-Yves

Re: Les dernières librairies Highcharts

Posté : 01 oct. 2019, 19:52
par PascalWMR
Salut Jean Yves.
J'ai trouvé le cafard.
J'essaie de le résoudre. Il provient des PlotBands sur l'axe yAxis.
En fin de compte les PlotBands masque les données !!!

A+
Pascal

Re: Les dernières librairies Highcharts

Posté : 01 oct. 2019, 20:04
par PascalWMR
Re.

Ça y est j'ai trouvé.
Pour résoudre le problèmes, il faut mettre le zIndex de chaque plotBands a 0 (zéro)

A+
Pascal