Vous ne le saviez peut-être pas, mais un de mes passes temps en ce moment est d’étudier la visualisation de données notamment pour le web, car ce domaine est en pleine ébullition actuellement avec l’apparition de l’HTML5 et de sa balise canvas (non standardisé dans la version 4) mais aussi toutes ces libraires JavaScript permettant de faire de beaux graphiques comme on aime.

J’utilise assez rarement des outils de visualisation de données, car j’en ai pas besoin dans mon travail actuel (études ou projets perso) mais je surveille de très prêt et teste une grande partie des solutions mises en avant (sauf flash & flex qui ont d’ailleurs de très bonnes librairies de visualisation.). Voici donc un petit résumé de ce qu’il se fait en la matière actuellement :

The JavaScript InfoVis Toolkit - Librairie vraiment sympa surtout en ce qui concerne données hiérarchisées. Elle possède une très large documentation avec de nombreux exemples.

Dygraphs – Très bonne libraire pour représenter sous forme de graphiques lambda (axes abscisses et ordonnées) des données plus couramment de type temporelles. Sympa pour des activités serveur par exemple.

Processingjs – On ne présente plus la librairie Java processing, véritable leader de la visualisation en Java. Voici son « équivalent » en Javascript. Tout comme processing en Java, son utilisation s’avère complexe pour des développeurs non matheux du dimanche (moi ?) cependant, elle permet de faire bien des choses !

jquery.sparkline – Cette libraire jquery permet de faire des petits charts vraiment superbes et peut posséder de multiples utilisations telles que pour modéliser des hits de téléchargements, de visites ou des activités clients side ou server side.

Protovis – Là, nous atteignons le summum de la visualisation de données en JavaScript. Cette librairie permet de tout faire (ou presque – sauf 3D) et possède un très bon rendu des charts. Si je me rappelle bien, c’est la seule permettant de parser des données par coordonnées parallèles permettant ainsi une bonne visualisation de données complexes du type logs de connexions par exemple. (étant une visualisation notamment utilisé par FP).

En ce qui concerne la visualisation de liens entre objet, nous pouvons noter quelques librairies sympa comme :

Moowheel – Cette libraire permet simplement de modéliser des liens entre objets disposés autour d’un même cercle avec de belles couleurs (ou non). L’utilité de ce script peut prendre sa place pour modéliser des liens entre personnes sur des réseaux sociaux ou autres.

JsViz – Cette libraire est assez cool, cependant elle reste mal gérée par les navigateurs. Elle permet là aussi de faire des liens dans l’espace entre différents objets et possède plusieurs modes d’affichage. Elle est encore trop lourde pour être ergonomique sur les différents navigateurs Internet ce qui en fait son principal défaut aujourd’hui.

The JavaScript InfoVis Toolkit – Là aussi cette librairie permet de modéliser des liens entre différents objets, notamment avec son mode Hypertree.

Voilà ce que l’on peut dire de la visualisation de données en javascript aujourd’hui. Récemment, google a mis en ligne une API de visualisation permettant là aussi de faire des beaux charts, mais je préfère pas en parler, car faire sa propre cuisine est toujours plus enrichissant. De plus, plusieurs hacks CSS/HTML permettent sans javascript de faire des trucs sympa tels que des pie charts ou autres.

Si vous voulez poursuivre votre voyage et avoir une réelle overview de ce qui se fait tant au point JS que PHP/Flash, voici un petit lien qui devrait vous plaire Tools for visualizing your data. =)

[Entête]

Ainsi, après de nombreuses heures à essayer de comprendre Joomla (sic) et au final, re-coder une partie des views (pour alléger l’affichage et le rendre sémantique – joomla n’étant pas sémantique), et réaliser mon propre template (car, il faut bien le dire, les templates de Joomla sont moches pour un site design (j’entends par là, du vrai design)) eh bien, le voilà en ligne !

En ce qui concerne le design, je l’ai voulu très ZEN et en paysage pour le header. Ainsi, cela symbolise l’eau et l’apaisement lié à la pêche (que l’on retrouve dans les transitions du header). Pour ce qui est des tons, du vert et du beige, simplement afin de rester dans cet environnement très calme. Point de vue prog’ dure, j’ai créé le « module » d’actualités et re-développé les menus qui me semblaient trop compliqués sous un template normal. Le logo de l’association a été aussi réalisé cette semaine en deux heures.

Bref, je suis assez content du travail fait même s’il y a quelques changements à faire sur le site (url rewriting, sémantique (H1 dans le titre), logo (ses couleurs), plan du site non linké, uF etc.). – Le tout est bien évidement administrable avec la zone d’administration – non ergonomique – de Joomla ! (wahou).