Le plugin PB Charts

Si vous savez faire ça :

Un beau tableau
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

alors vous n’aurez pas de mal à faire cela :

Un beau graphique
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

Pour rappel, le tableau se code dans SPIP avec les barres verticales (pipes) ainsi :

||Un beau tableau||
{{1992}} | {{1993}} | {{1994}} |
{{Valeur 1}} | 12.5 | 13.6 | 15 |
{{Valeur 2}} | 13.6 | 11.12 | 9 |
{{Valeur 3}} | 14.7 | 12.5 | 13 |

vous pouvez facilement transformer ce tableau en graphique ainsi :

<chart type="line">
line ||
1992 | 1993 | 1994 |
Valeur 1 | 12.5 | 13.6 | 15 |
Valeur 2 | 13.6 | 11.12 | 9 |
Valeur 3 | 14.7 | 12.5 | 13 |
</chart>

• On supprime le gras (ainsi que tous enrichissements typographiques éventuels).

• On encadre le tableau entre les mentions :

<chart type="line">
...
</chart>

Le « type » est à choisir parmi toutes les possibilités offertes par SWF/XML Charts de Maani. Vous trouverez de nombreux exemples ci-dessous.

• La règle est simple : outre une éventuelle ligne de déclaration du titre du graphique (deux barres verticales en début et fin de ligne), il faut retenir que la première ligne de valeurs définit les noms des colonnes (« 1992 », « 1993 », « 1994 ») ; la première colonne de valeurs définit les titres des séries (« Valeur 1 »...).

La seule difficulté, en pratique, se rencontre lorsqu’il n’y a qu’une seule série de valeurs. C’est systématiquement le cas, par exemple, dans le cas des « Camemberts » (Pie). Dans ce cas, il ne faut pas oublier de prévoir cette première colonne, quitte à la laisser vide.

Et maintenant, voici une belle collection de graphiques :

column
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

stacked column
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

floating column
Valeur 1	12.5	13.6	15
Valeur 2	10	11.12	9

3d column
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

stacked 3d column
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

parallel 3d column
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

bar
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

stacked bar
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

floating bar
Valeur 1	12.5	13.6	15
Valeur 2	10	11.12	9

area
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

stacked area
Valeur 1	12.5	13.6	15
Valeur 2	13.6	11.12	9
Valeur 3	14.7	12.5	13

candlestick
max	9	8	9
min	3	4	2
open	5	5	4
close	8	7	6

polar
Valeur 1	6	3	15	5	4
Valeur 2	13.6	5	9	10	7
Valeur 3	2	12.5	13	9	12

Installation du plugin

Le plugin utilisant XML/SWF Charts de Maani, qui n’est pas libre, je ne peux pas livrer tous les fichiers directement.

• Récupérez, décompactez et installez le plugin PB Charts.

• Rendez-vous dans l’espace « Download » de Maani ; récupérez l’une des archives, décompactez l’archive.
• Installez le contenu le fichier « charts.swf » et le dossier « charts_library » dans le dossier « pb_charts/charts » du plugin.
• Activez le plugin.

Sur le site public

Vous avez la possibilité de personnaliser les couleurs et les dimensions des graphiques sur le site public, en modifiant les variables globales (dans mes_fonctions.php par exemple) suivantes :
• couleur_claire définit la couleur de la première série ; les autres couleurs sont calculées automatiquement avec mes scripts de roue chromatique ;
• couleur_texte définit la couleur du texte des légendes ;
• largeur_charts et hauteur_charts définissent les dimensions d’affichage des graphiques.