2 -Data-Driven Documents (D3)

Cette bibliothèque fournit des fonctions permettant de relier des données à une partie de document HTML. Il est alors possible de transformer ce document en fonction des données. Ce n'est pas une bibliothèque comme Google Chart Tools qui propose un certain nombre de gabarits à personnaliser. Il s'agit davantage d'un langage spécialisé qui facilite la création de designs à partir d'un canvas HTML.

Intérêt : Les dessinateurs inspirés pourront créer à peu près tout ce que leur imagination leur inspirera et réaliser ainsi tous les designs interactifs qu'ils veulent. D3 utilise jQuery et des selecteurs de type CSS pour retrouver des éléments dans le document HTML (plus précisément, dans le DOM, Document Object Model) et les transformer. Ce qui, pour certains, semble plus simple que passer directement par JavaScript. Différents formats de données sont supportés incluant XML et CSV, de même que JSON, ainsi qu'une fonctionnalité pour parcourir facilement les jeux de données. Inconvénients : Si cette bibliothèque est puissante, son apprentissage est plus long comparé à d'autres. Et puisqu'elle demande de partir d'une page blanche, il faut à la fois savoir coder et dessiner pour créer quelque chose de valable. A moins qu'il s'agisse de transformer du code « emprunté » ailleurs.

Niveau de compétences : expert

Exemples : Le site du New York Times fournit deux exemples très intéressants, l'un illustrant l'entrée en bourse des grands acteurs des technologies de l'information et l'autre sur les propositions de budget de Barack Obama pour 2013.

En savoir plus : la page de tutorial D3 propose une longue liste de ressources, dont celles proposées par Scott Murray, qui présente les bases du livre Interactive Data Visualization for the Web.