#AJA Comment synchroniser l’axe temporel de Highcharts par rapport à l’heure client

on

Dans le contexte de développement front-end, vous avez sûrement eu affaire à Highcharts. Cet outil est très puissant, mais il faut parfois avoir la patience de lire les pages de documentation détaillée pour arriver au résultat que l’on souhaite.

C’était mon cas il y a quelques jours. Mon problème était que Highcharts affichait bien les données sans problème. La tooltip au dessus des points de données reflétait bien l’heure au fuseau horaire du client mais l’axe temporel était en UTC.

Après quelques recherches, il s’avère que Highcharts peut être configuré pour qu’il soit en mode UTC ou local comme documenté ici.

Pour faire simple vous devez faire comme suit :

Highcharts.setOptions({
  time: {
    useUTC: false
  }
});

Autre remarque importante, vous points de l’axe temporel doivent bien être au format ISO ou en tant qu’objet Momentjs ou Date. Si le format de vos dates est un peu particulier, vous pouvez définir la méthode parseDate comme sur cet exemple.

N’hésitez pas à me faire signe si une erreur s’est glissée dans l’article ou si vous avez une suggestion, correction ou toute autre question!

Laisser un commentaire

Contenu non disponible.
Merci d’accepter les cookies en cliquant sur « Accepter » sur la bannière.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

En continuant à utiliser le site, vous acceptez l’utilisation des cookies. Plus d’informations

Les paramètres des cookies sur ce site sont définis sur « accepter les cookies » pour vous offrir la meilleure expérience de navigation possible. Si vous continuez à utiliser ce site sans changer vos paramètres de cookies ou si vous cliquez sur "Accepter" ci-dessous, vous consentez à cela.

Fermer