FAT78 - Artisan numérique :-)
 

> Lab > Graphiques ?

lundi 12 décembre 2016

Graphiques ?

Ben ... oui ! On peut tracer des graphiques assez simplement, moyennant une installation un peu complexe.
— 1) il faut télécharger et dézipper le plugin "JpGraph" ici : http://files.spip.org/spip-zone/jpgraph.zip
— 2) il faut télécharger et dézipper la librairie "jpgraph" (version 3.0.7) ici : https://sourceforge.net/projects/jpgraph/
— 3) il faut tester les capacités du serveur en ouvrant les instructions de la librairie "jpgraph/docs/index.html" et suivre les instructions données dans la page "3.2. Necessary system requirements for the library" (pour cela il faudra créer divers fichiers php, les installer sur le serveur et les lancer pour vérifier leur correcte exécution)
— 4) il faut ouvrir le fichier src/jpg-config.inc.php de la librairie "jpgraph" pour le modifier en enregistrant les chemins du cache (ici = /local/cache-jpgraph/) et des polices ttf (ici = squelettes-dist/polices/) aux lignes 38 39 40 (enlever ensuite les // en début de ces lignes)
— 5) sur le serveur il faut créer dans "/lib" le répertoire "/jpgraph-3.0.7"
— 6) recopier dans "/lib/jpgraph-3.0.7" le fichier "VERSION" et le répertoire "src" de la librairie "jpgraph"
— 7) installer "normalement" le plugin "JpGraph" ... ouf !!!

Maintenant on dispose d’un modèle <jpgraph> qui permet de tracer des graphiques et dispose d’un grand nombre de paramètres :

Par exemple, le graphique ci-dessous

Plugins
est obtenu par l’écriture suivante :
<jpgraph|type_graphe=barre|titre=Plugins|
donnee=10;12;20;40|legende=Agenda;Crayons;CFG;Divers|
largeur=480|hauteur=480|couleur=darkgreen>

Ce modèle génère une image png (le diagramme) de dimensions fixes (donc pas responsive) : une taille de 480 x 480 pixels est un choix qui convient à tous les supports.

Une alternative à "jpgraph" consiste à utiliser l’API "Google Charts" qui permet d’intégrer à sa page web un javascript qui peut aller récupérer les donnée à afficher sur un tableau dans "Google documents". Voir ici : https://developers.google.com/chart/interactive/docs/


SPIP | | Plan du site | Suivre la vie du site RSS 2.0