Générer des graphiques dynamiquement

Un développeur web rencontre un jour ou l'autre la nécessité d'afficher des graphiques sur son site. Il est effectivement plus agréable de présenter des statistiques (courbes de fréquentation, répartition des tâches, …) sous forme graphique. C'est plus lisible et moins rebutant. 

Dans notre cas nous souhaitons afficher des graphiques comparatifs pour « évaluer » des utilisateurs : graphiques en barre, nuages de points. Ces graphiques devront être interactif (par exemple nous afficherons des détails lors du clic sur une barre). Ils devront également ne pas trop être gourmands en performance car le nombre de consultation sera important.

Nous avons choisi jqPlot. Voyons le cheminement qui nous a mené à ce choix.

Générer les graphiques : solution serveur ou solution cliente ?

Lorsqu'on cherche à afficher des graphiques sur son site internet, on est mis face à une suite de choix. Le premier est la technologie qui sera employée pour la génération des graphiques.

On commence par choisir si on veut générer les graphiques depuis le serveur ou sur la machine du client. Voici un tableau récapitulatif des possibilités qu'offrent les deux alternatives :

Le choix dépend comme toujours le l'objectif. Nous choisirons donc de générer les graphiques par l'intermédiaire du client principalement si on veut éviter d'impacter les performances du serveur et si on souhaite intégrer une notion d'interactivité aux graphiques. C'est notre cas.

Voici tout de même un lien vers une librairie php qui a l'air assez chouette : http://pchart.sourceforge.net/index.php

Flash ou Javascript ?

Des solutions clients, il n'y en a pas 60. On oublie les applets Java parce qu'elles sont vieillotes et trop contraignantes. Il nous reste Flash et Javascript. Loin de nous l'idée de vouloir ressortir la liste complète des avantages et inconvénients liés à leur utilisation en général. Voici juste un schéma récapitulatif de nos principaux facteurs de choix :

Nous avons choisi le Javascript, principalement parce que nous maitrisons mieux la technologie. L'autre raison est qu'il existe beaucoup plus de librairies Javascript que de librairies Flash pour générer les graphiques.

Pour ceux qui feront le choix inverse, voici un lien vers une librairie Flash vraiment chouette : http://www.amcharts.com/

Le choix de jqPlot

A partir du moment où on a choisi d'utiliser le Javascript pour générer les graphiques, le choix est vaste. Il existe de nombreuses librairies, parmi lesquelles beaucoup sont de bonne qualité.

On peut trouver ici une liste assez exhaustive des solutions existantes : http://sixrevisions.com/javascript/20-fresh-javascript-data-visualization-libraries/

Nous avons retenu les plus sympa :

• HighChart : le problème est qu'il faut payer pour une utilisation non-commerciale

• The JavaScript InfoVis Toolkit : une librairie ahurissante, permettant notamment de faire des mindmaps. Elle ne permet malheureusement pas de faire des graphiques simples (camemberts, barres etc.)

• Moocharts : très jolie et interactive. Malheureusement en version bêta.

• JqPlot : notre choix, cette librairie est avant tout complète et stable. Elle fonctionne de plus avec l'excellente librairie jQuery.

JqPlot fera l'objet d'un prochain article, un tutoriel nommé « Un premier graphique avec JqPlot ».