Graphiques

TODO

Hightcharts

TODO

Sparkline

Les "sparklines" ou "spark" sont des mini-graphiques permettant de visualiser rapidement l’évolution d'une valeur dans le temps. La librairie utilisée est basée sur jquery, vous trouverez plus d'informations sur la page de l'éditeur : jquery.sparkline.js[1]

Une balise <spark> existe déjà pour vous permettre de créer rapidement ce type de graphique sans manipuler du javascript.

Cependant si vous souhaitez aller plus loin et exploiter au mieux cette librairie, je vous invite a consulter le site de l’éditeur pour des exemples d'utilisation complexe.

Je propose ici un exemple simple de mise en œuvre :

Le code suivant

<span class="dynamicsparkline">Loading..</span>

<script>

var myvalues = [10,8,5,7,4,4,1];

$('.dynamicsparkline').sparkline(myvalues);

</script>

aura ce résultat :

Sympa me direz vous, mais les valeurs présentées ici ne sont pas très dynamiques. Voyons donc comme récupérer un échantillon de valeur depuis la base de données Sentinelle pour une composante.

D3js

TODO