Google Charts n’est pas le service du géant américain le plus connu et quel dommage ! En effet, Google Charts permet de générer des graphiques dans votre page web très facilement et sans la moindre installation !
Google Charts est une API qui fonctionne par requête HTTP GET. Toutes les données du graphique (taille, type, valeurs numériques, labels, couleurs etc…) sont passées dans la chaîne de requête (http://charts.api.google.com/etc…), et en retour, une image s’affichera et représentera le graphique demandé. L’avantage le plus évident est que vous n’aurez plus à générer vous même les graphiques coté serveur. Votre seule action est d’écrire l’URL, et l’API CHARTS de Google fait le reste !
Exemple en direct :
La requête “http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=600×200&chl=Free|Tools” donnera le graph suivant :
Les types de graphiques sont les suivants :
- Lignes
- Barres
- Camemberts
- Diagrammes
- Nuages de points
- Cartes
- Gauges
Simple, efficace, puissant et rapide… que demander de plus… que l’api passe open source ? 
Site Internet : Google Charts
Licence : Gratuit
FgCharting est un plug in jQuery qui permet de créer des diagrammes depuis des données contenues dans des tableaux HTML standards (”table”, “/table”). FgCharting, pour afficher le diagramme, s’appuie sur le tag “canvas” (voir article - Utililser le tag “canvas” avec Internet Explorer).
En utilisant FgCharting, vous pourrez afficher des diagrammes de type :
- ligne
- camember
- secteur
- barre
- etc…
Cette solution s’avère très simple à mettre en oeuvre. Il suffit d’ajouter le fichier “fgCharting.jQuery.js” et de créer un tableau en respectant la nomenclature de FgCharting.
Site Internet : FgCharting
Licence : GPL
Flot est une bibliothèque 100 % Javascript pour jQuery. Il permets de générer, cote client, des graphes sous forme de point/courbes.
Flot ne vous autorisera pas d’autres options… mais si Flot ne fait qu’une chose, il la fait bien ! De plus, les graphes produits sont réussis et clairs et vous avez aussi une option “zoom” pour agrandir une zone de votre graphe. Facilement adaptable, Flot a été pense des sa conception au web 2.0.
Site Internet : Flot
Licence : MIT
Open Flash Chart vous permettra d’afficher des diagrammes de toutes formes (camembert, barre, ligne etc.). L’originalité de cette ressource est que les graphes sont affichés avec la technologie Flash.
Comment travaille Open Flash Chart ?
- L’utilisateur affiche votre page internet.
- Le navigateur télécharge la page Web qui contient le Diagramme.
- Open Flash Chart télécharge le fichier de données et affiche le diagramme (vous aurez indiqué à Open Flash Chart où se trouvent les données à afficher).
Le plus de cette ressource est sa simplicité enfantine pour créer un graph. Téléchargez et installez « open-flash-chart.swf » sur votre serveur. Ensuite, dans vos pages web, vous devrez inclure Open Flash Chart dans votre page HTML et vous devez aussi fournir le fichier de données sur le serveur. Le fichier de données peut être un fichier texte, un fichier .php, Perl, Python, Java.
Pour résumer, disons qu’un « include » et « 10 lignes de code » suffiront pour arriver à vos fins ! Et le résultat est magnifique…
Site Internet : Open Flash Chart
Licence : Gratuit
Solutoire a repris le code de PlotKit (c.f article du 5 septembre 2007, menu Graphes) et il a ré-écrit plusieurs parties lui-même pour créer Plotr qui, principalement, s’affranchit de la bibliothèque Mochikit. L’énorme avantage : un code poids plume de 12ko !
Mais, ce n’est pas pour autant que Solutoire rogne pas sur les options! Il y a plus de 30 options disponibles pour personnaliser vos diagrammes. Vous pouvez afficher des camemberts, des diagrammes de lignes et des diagrammes de barres/colonnes.
Site Internet : Solutoire
Licence : BSD License
PlotKit est une librairie Javascript permettant la génération et l’affichage de graphique digne Excel. La librairie supporte un affichage HTML et SVG (via Adobe SVG Viewer). La librairie est bien documentée et simple à utiliser.
Site Internet : http://media.liquidx.net/js/plotkit-tests/dynamic.html
Licence: BSD
Planete Freewares
