La DataViz avancée sur le Web en JavaScript avec D3.js

D3.js est depuis quelques années la bibliothèque standard pour la création de visualisation de données (dataviz) sur le web. Il est donc indispensable de maîtriser cette bibliothèque si un programmeur souhaite :

  • Créer sa propre dataviz from scratch à partir de mockups
  • Adapter un des nombreux exemples D3.js disponibles sur https://d3js.org/
  • Contribuer à une bibliothèque de visualisation basée sur D3.js (c3js, nvd3, ..)
  • Intégrer une visualization ou une bibliothèque basée sur D3.js dans un framework (react, angular) sous forme de component

Tech Tech
#WORKSHOP in French
Friday April 21st
10:00 - 11:50

Turing room (S122)

D3.js a les caractéristiques suivantes que je présenterai dans l'atelier, afin de :

  • Facilement manipuler le DOM d'une page web à la JQuery, aussi bien en SVG qu'en Canvas
  • Facilement créer des axes, labels et autres finitions indispensables à une dataviz professionnelle
  • Interpoler différents états du DOM pour faire des transitions animées
  • Création des layouts complexes de graphes ou de Treemap

Ce workshop a pour but d'être très technique et s'adresse à un publique qui maitrise au moins la programmation web en général, mais idéalement JavaScript niveau avancé et maitrise l'utilisation de bibliothèques (JQuery, ..) ou framework JS (mais ce n'est pas indispensable).

Nous verrons donc pendant ce workshop :

Les participants pourront coder en live les exemples fournis au préalable dans l'interface http://blockbuilder.org/ . Les principes de base de la visualisation seront aussi rapidement rappelés, ainsi que l'utilisation de vrais jeux de données pour les exemples.

Le code du workshop sera disponible sur GitHub, et il est fortement recommandé de venir avec une machine, sur laquelle Node JS sera pré-installé. Une bonne prise en main de Git est aussi utile.

Romain Vuillemot

LIRIS Ecole Centrale de Lyon

Ma bio


 

Other talks from Romain

2018 - Dataviz sans data: le prototypage rapide de visualisation de données.. sans données!

  • #WORKSHOP
  • Romain Vuillemot

Les dataviz sont de plus en plus populaires mais restent difficile à créer. Ce workshop propose a pour but d'initier les participants aux méthodes de prototypes de visualisation de données sous forme de grids et de maquettes interactives, en noir et blanc. La particularité du prototypage sera d'être réalisé en live coding en JavaScript.

2016 - Outils simples de visualisation pour le data scientist

  • #WORKSHOP
  • Romain Vuillemot

Je présenterai les outils de visualisations pour la caractérisation et de modélisation d'un jeu de données (Python, Tableau), d'aide au nettoyage (Trifacta, Data wrangler) et la communication de résultats sur le web avec storytelling (D3JS, HighChart, NVD3).