JpGraph

Intégration de la bibliothèque JpGraph, pour réaliser des graphes (histogrammes, courbes, camemberts, ...) dans SPIP

Démonstration

Le plugin permet de créer des graphes simplement.
Par exemple

Grâce au modèle :

<jpgraph
|type_graphe=courbe
|titre=Consommation de noisettes par an
|donnee=3;1.3;7;30;27.5
|legende=2006;2007;2008;2009;2010
|largeur=500
|hauteur=300
|couleur=green>

Installation du plugin

Ce plugin requiert un serveur avec une version PHP5.1+ avec l’extension GD active.

Avant d’activer le plugin, il faut installer la libraire JpGraph.
Attention cela réclame un peu de patience

  • Télécharger l’archive de JpGraph
  • A la racine de votre site, créer un répertoire ./lib/jpgraph-3.0.7
  • Copier dans ce répertoire les fichiers de l’archive (inutile de copier le répertoire docportal inutile et volumineux).
  • Editer le fichier ./lib/jpgraph-3.0.7/src/jpg-config.inc.php

Par exemple, pour une installation wamp sur windows
Décommentez les lignes

// WINDOWS:
//  CACHE_DIR $SERVER_TEMP/jpgraph_cache/
//  TTF_DIR   $SERVER_SYSTEMROOT/fonts/
//  MBTTF_DIR $SERVER_SYSTEMROOT/fonts/

par

define("CACHE_DIR","../../../tmp/jpgraph_cache/");
define("TTF_DIR","C:/WINDOWS/Fonts/");
define("MBTTF_DIR","C:/WINDOWS/Fonts/ja/TrueType/");

Lorsque c’est bon, vous pouvez activer le plugin dans la partie privée de SPIP de la façon habituelle.

Attention, la librairie JpGraph est sous une licence inhabituelle QPL 1.0 (Qt Free Licensee). Nous utilisons pour le plugin la version 3.0.7 gratuite pour un usage non-commercial et opensource. Consulter le site officiel pour plus de détails http://jpgraph.net/

Utiliser JpGraph pour les rédacteurs

Pour créer un graphe, il faut utiliser le modèle

<jpgraph
|type_graphe=barre
|titre=Vos plugins préférés
|donnee=10;12;20;50
|legende=Agenda;Crayons;CFG;Divers
|largeur=450
|hauteur=450
|couleur=blue>

La syntaxe complète est :

Nom de paramètreDescriptionValeurs possiblesObligatoire
type_graphe modèle de graphe courbe, barre, camembert
titre titre du graphique
donnee donnée de graphique séparée par «  ; » réel (5.1) oui
legende legende séparée par «  ; »
largeur largeur en pixels oui
hauteur hauteur en pixels oui
couleur couleur de motif nom de la couleur en anglais (red), inutile pour les graphes camemberts

Lorsque le plugin est activé, vous pouvez consulter la page de démonstration http://monsite/spip.php?page=demo_jpgraph

Utiliser JpGraph dans vos squelettes

Il est possible d’utiliser JpGraph pour générer des graphes dynamiques à partir de vos boucles

#SET{c_article,0}
<BOUCLE_cA(ARTICLES)> </BOUCLE_cA>
#SET{c_article,#TOTAL_BOUCLE}</B_cA>
#SET{c_rubrique,0}
<BOUCLE_cB(RUBRIQUES)> </BOUCLE_cB>
#SET{c_rubrique,#TOTAL_BOUCLE}</B_cB>
#SET{c_mot,0}
<BOUCLE_cC(MOTS)> </BOUCLE_cC>
#SET{c_mot,#TOTAL_BOUCLE}</B_cC>

[(#MODELE{jpgraph}
{type_graphe=barre}
{titre=Statistiques du site}
{donnee=[(#GET{c_article})];[(#GET{c_rubrique})];[(#GET{c_mot})]}
{legende=Nb Articles;Nb Rubriques;Nb Mots}
{largeur=500}
{hauteur=300}
{couleur=orange})]

Génére

Etendre le plugin

JpGraph dispose d’énormement de types de graphes. N’hésitez pas à compléter ce plugin selon vos besoins.

Les graphes générés sont stockés dans local/cache-jpgraph/. Il faudra sans doute réfléchir à mieux gérer les images et le cache.

Le code source du plugin est disponible sur la zone. N"hésitez pas à participer.

Alternatives à JpGraph

Techniquement, il est possible d’utiliser d’autres ressources pour générer des graphes.

Discussion

20 discussions

  • Bonjour,
    je viens d’installer ce plugin qui nécessite impérativement la librairie jpgraph-3.0.7, alors que le lien de téléchargement aboutit à la dernière version (4.0.1) qui n’est pas totalement compatible avec le plugin (par exemple les couleurs ne sont pas modifiables).
    Un lien pour obtenir la 3.0.7 est : https://sourceforge.net/projects/jpgraph/
    Voila, avis aux amateurs de graphiques dans spip.
    Ceci mis a part, ça fonctionne !
    Merci pour ce plugin :-)

    Répondre à ce message

  • Très utile

    Répondre à ce message

  • Bonjour Erational et Olivier Gautier,

    Bravo et Merci pour cette excellente adaptation de JpGraph à SPIP.

    D’autre part j’ai survolé le site http://www.highcharts.com/, les graphiques présentent un design impressionnant, quelqu’un envisage-t-il d’en faire un plugin pour SPIP ?

    Cordialement

    FDG

    Répondre à ce message

  • 2
    Movihardt

    Je voulais savoir si vous aviez le projet d’intégrer la bibliothèque highcharts (http://www.highcharts.com/) dans un plugin semblable. Il me semble que c’est très fort. Qui plus est, avec la boucle DATA et la construction dynmaique de fichiers XML, ça pourrait être très sympa. Non ?

    • bonjour

      on a déjà évoqué highcharts dans ce forum (voir plus bas)
      oui la bibliothèque est prometteuse sous réserve de tenir compter de la licence CC non commerciale (ou prévoir un champs pour intégrer la clé pour les versions pro) http://shop.highsoft.com/highcharts.html

      je n’ai pas actuellement le temps de m’en occuper mais cela semble assez simple à réaliser : tout est basé sur du javascript que SPIP peut facilement gérer à la volée.
      libre à vous de lancer le chantier !

      cordialement

    • Je suis moi aussi très intéressé par highcharts que je trouve très élégant, mais je n’arrive pas à l’intégrer à spip. Je ne comprends pas comment il faut appeler un graphique pour l’intégrer dans un article. Si quelqu’un a une idée, en attendant un plugin qui serait le bienvenu, je suis volontiers preneur !

    Répondre à ce message

  • 1
    Miguel Perez

    Est ce qu`il ya une version pour spip 3.0 ?

    Répondre à ce message

  • 2

    Plugin intéressant, mais la librairie vieillit un peu, et surtout la librairie JS Highcharts est une alternative solide. Elle déporte les calculs côté navigateurs, les rendus sont jolis, ça s’intègre vraiment bien avec jQueryUI.

    • Je suis d’accord avec vous. Merci pour le lien. La bibliothèque Highcharts semble puissante, complète et facile d’utilisation. Cela méritait le lancer le chantier pour l’intégrer dans un plugin Spip en spécifiant bien les obligations de la licence (payant pour les projets commerciaux).

    • Thierry

      +1 ça m’intéresse beaucoup... et si vous avez besoin d’un coup de main...

    Répondre à ce message

  • daccord ca a lair bien

    Répondre à ce message

  • j’ai un problème avec JPgraph et Jqueri

    <script type="text/javascript" src="./js/jquery-1.2.6.min.js"></script> <script type="text/javascript" src="./js/script.js"></script>

    comment regké se problème
    merci d’avance

    Répondre à ce message

  • Bonjour,
    serait il possible générer des graphes avec ce plugin en utilisant des données directement dans notre base de données. C par exemple avec des requêtes SQL !!
    Merci d’avance.

    Répondre à ce message

  • Bonjour,
    J’ai fait fonctioner le plugin jpgraph mais je souhaite réaliser une courbe en passant en abscisse les valeurs stockées dans une table.
    Comment affecter donnee=[ ]
    Merci d’avance

    Répondre à ce message

  • 1
    zatoune

    Bonjour,

    Quelqu’un aurait-il une idée pour une erreur http 500 générée lorsque j’essaye d’accéder à la page demo_jpgraph ? (d’ailleurs pour info, sur la page du plugin, le nom de fichier est écrit "demo_jgpraph au lieu de demo_jpgraph). Je sais que c’est assez vague mais c’est surtout dans l’espoir de trouver un début de solution, vu que je sèche depuis quelque temps.
    Je précise que j’ai a priori bien suivi la procédure pour l’installation.
    Merci d’avance pour les pistes

    • j’ai corrigé le lien de l’article.
      La page de test est en effet http://../spip.php?page=demo_jpgraph

      Merci de vérifier si vous avez les requis :

      • php 5.1 ou plus
      • la libraire GD disponible

      Pour une 1re installation, il n’est necessaire d’éditer ./lib/jpgraph-3.0.7/src/jpg-config.inc.php. Vous pourrez le faire ensuite si vous voulez avoir un cache sur les images générées.

    Répondre à ce message

  • 3

    Bonjour,

    j’ai installé la librairie (sans rien toucher) et j’ai installé le plugin.

    Lorsque je mets le code de test pour voir (consommation de noisettes dans l’année), j’ai ensuite ce message d’erreur sur l’écran :

    Warning : chdir() [function.chdir] : No such file or directory (errno 2) in /home/domaine/www/plugins/jpgraph/jpgraph_fonctions.php on line 126

    Warning : require_once(src/jpgraph.php) [function.require-once] : failed to open stream : No such file or directory in /home/domaine/www/plugins/jpgraph/jpgraph_fonctions.php on line 127

    Fatal error : require_once() [function.require] : Failed opening required ’src/jpgraph.php’ (include_path=’. :/usr/share/php5’) in /home/domaine/www/plugins/jpgraph/jpgraph_fonctions.php on line 127

    Où dois-je résoudre quel bug ? Du côté du zip du plugin ou bien du côté de la librairie ?

    MErci d’avance !

    • bonjour,

      je viens de réinstaller un SPIP 2.1.8 avec le plugin JpGraph avec succès.

      Vérifier que votre librairie est bien installée dans ./lib/jpgraph-3.0.7/
      Par ex. le fichier jpgraph.php doit se trouver dans ./lib/jpgraph-3.0.7/src/jpgraph.php

      D’autre part, j’ai mis à jour le plugin avec un nouveau mode d’inclusion de la librairie.
      Le zip devrait être disponible d’ici quelques heures.
      Merci de me dire si cela marche.

    • Ca marche, merci !

      Pourquoi cette librairie là ne doit pas être rangée là où se trouvent les autres librairies que demandent d’autres plugins ?

      Mais sinon, voilà, maintenant ça fonctionne comme sur des roulettes.

    • Je suis content que cela marche.

      SPIP distingue deux répertoires pour ranger les librairies :

      • /lib/ pour librairies des plugins comme JpGraph, Fancybox, ....
      • ./extensions/ pour les librairies du noyau comme safehtml, JavascriptPacker, ....

    Répondre à ce message

  • 1

    bonsoir,

    un truc qui semble marcher....

    je ne trouve pas la version 3.0.6 de jpgraph, mais la 3.0.7
    j’installe la 3.0.7, mais en activant le plugin, j’ai toujours le message « il faut la librairie.. »

    donc je ruse en renommant le dossier jpgraph-3.0.7 en jpgraph-3.0.6
    ca fonctionne pour l’activation du plugin..
    et ca semble fonctionner tout court..

    il y a peut-être des différences après... ?

    pam

    • merci pour votre remarque, j’ai mis à jour le plugin pour qu’il prenne la dernière version de jpGraph (la 3.0.7 au lieu de la 3.0.6)

    Répondre à ce message

  • 4

    Le lien indiqué est erroné :
    Télécharger l’archive de JpGraph

    • Le lien indiqué est erroné : Télécharger l’archive de JpGraph

      peux tu préciser ?
      je viens de cliquer sur le lien et le téléchargement s’effectue sans pb.

    • Voila le message que j’ai quand je cliques sur le lien :

      Not Found
      The requested URL /jpgraph2/jpgraph-3.0.6.tar.bz2 was not found on this server.

    • je croyais que tu parlais du téléchargement du plugin jpgraph et non de la libraire jpgraph

      En effet, le lien indiqué n’était plus valide car une nouvelle version est sortie. J’ai mis à jour le lien télécharger la libraire jgraph (choisir la branche 3.x.x)

      merci pour ce retour.

    • Je parlais bien du lien vers la librairie. Je te signale cependant que celui-ci comporte une petite erreur : hhttp ://www.aditus.nu/jpgraph/jpdownload.php (il y a un « h » de trop).

      Merci pour ta réactivité.

    Répondre à ce message

  • Tropicaloo

    Bonjour,

    Dans le référentiel, pour le gestion des couleurs, il est précisé :

    Pour l’instant ce paramètre n’est pas pris en compte pour les graphes camemberts (à réécrire car partiellement faux).

    Je suis très interessé par ce paramètre et je vais essayer d’y travailler. Si quelqu’un a quelques pistes pour m’aider à défricher la forêt, je suis preneur
    Merci.

    Répondre à ce message

  • Je me perd dans boucles et commandes... auriez-vous d’autres exemples de Boucles, svp ?
    merci

    Répondre à ce message

  • il y a la librairie Open Flash Chart qui est tres interessante aussi (sauf pour les flashophobes :p ) et surtout Open Source... bravo pour cette contrib au passage :)

    Répondre à ce message

  • 1

    Chouette plugin qui vient combler un vide.

    2 questions :
    -  Pourquoi php5 ? cela en jette dehors plus d’un
    -  Pourquoi ne pas ajouter le diagramme de Gantt qui associé à Agenda permet la gestion de projet ?

    • Concernant PHP 5, c’est imposé par la librairie JpGraph, donc on ne peut pas intervenir là-dessus puisque c’est externe au développement de SPIP. Encore qu’il n’est pas interdit de tester sous PHP 4 pour voir ce que cela peut donner...

      Concernant les diagrammes de Gantt, et d’autres modèles de diagrammes, il est prévu que les 3 diagrammes de base soient enrichis par d’autres modèles. C’est juste une question de temps...
      A bientôt donc.

    Répondre à ce message

  • bravo pour ce plugin !

    ce qui serait bien maintenant c’est d’avoir la possibilité d’introduire les détails pour un graphe directement depusi l’interface de SPIP, je pense à une extension pour le plugin porte plume...

    à la fin on obtient les écritures correspondant au modèle jpgraph que tu utilises !

    ce n’est qu’une idée..ça serait bien qu’elle se concrétise.

    @+

    Répondre à ce message

  • 1

    Dommage que tu n’as pas utilisé Artichow comme librairie graphique.

    • j’ai initialement essayé avec artichow mais la librairie est rentrée en conflit avec le noyau de spip. (classe artichow mal écrite ?) mais libre à toi d’essayer de reprendre ce chantier avec artichow.

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom