#Viz : les joueurs du Top14 en nuage de points

Avant de quitter Libé j’ai travaillé sur un projet qui — en tant qu’amateur de rugby — m’a bien motivé : une visualisation de l’évolution de la morphologie des rugbymen entre la Coupe du monde 1995 et celle de 2015. Le résultat est vraiment chouette et ça permet de mettre une image sur une réalité, les rugbymen sont devenus des brutes.

Évidemment ce n’est pas moi qui ai réalisé toute la partie développement. Mais tout ça a été codé grâce à D3.js et vu que ça faisait longtemps que je n’avais pas fait quelque chose avec cette librairie, j’ai voulu réitérer l’expérience.

Je me suis donc mis en tête de visualiser par un nuage de points l’ensemble des joueurs du Top14 pour la saison en cours. Ce qui donne ça :

Image Top 14(Cliquez sur l’image pour accéder à l’application web)

Pour moi c’était plus l’occasion de proposer un produit qui tient la route graphiquement qu’un réel travail de données. L’occasion de se frotter à la technique et aboutir à quelque chose qui me plaisait à l’œil. On peut quand même en tirer quelques enseignements : oui, Mathieu Bastareaud est définitivement hors norme, planqué au milieu des piliers et le vétéran Mike Phillips fait tache chez les demi de mêlées avec son physique de troisième ligne.

Et finalement, le plus gros souci est venu principalement de ma volonté de faire des checkboxes personnalisées, que ce soit pour le choix des postes ou pour le choix des équipes. Dernière difficulté : gérer les doublons quand certains possèdent exactement la même morphologie. Dans ce cas je me suis appuyé sur un exemple de D3 qui permet deux modes de lecture.

Le résultat est visible par ici : http://julienjego.fr/lab/top14/ et le code est dispo sur Github : https://github.com/julienjego/top14 .

Publicités

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s