LogoMaverick


Georges-Pierre Bonneau




email:
Georges-Pierre.Bonneau at inria.fr
snail mail:
LJK
INRIA Rhône-Alpes
655 Av. de l'Europe
F-38330 Saint-Ismier (France)
Phone
(+33) 476-615-406
Professor at Grenoble Universités.
Research at Lab. LJK and INRIA in the MAVERICK group

red line

[Home] [Publications] [Activities] [Teaching] [Short CV]

red line


Visualisation d'Information

Objectifs de la formation:

Description:

L'essor des masses de données, Big Data, pose de multiples défis. Parmi ces défis celui de l'analyse des données n'est pas le moindre. Comment détecter les corrélations, les comportements extraordinaires, les caractéristiques salientes dans les masses de données accessibles? Notre cerveau, par notre canal visuel, est habitué à résoudre de manière routinière de tels problèmes. Bombardés de photons, notre système visuel les analyse et en déduit une reconstruction mentale du monde physique nous environnant, dans lequel chaque entité est reliée à nos connaissances antérieures. Comment utiliser cette puissance de traitement pour aider à l'analyse visuelle des données, tel est le but de la visualisation d'information.

Dans ce cours nous aborderons points suivants:

Chaque séance de trois heures se décomposera en une partie de cours et une partie pratique.

Evaluation:

L'évaluation sera basée sur le contrôle-continu. Les étudiants devront remettre plusieurs prototypes logiciels et rapports, et devront faire un exposé oral sur un sujet qui leur sera soumis.

Planches/Notes de cours:

Travaux pratiques:

Date de rendu Sujet

Documents

XXX

Propriétés des variables visuelles: produire en D3 plusieurs documents SVG illustrant les variables visuelles et leur propriétés. Type de rendu: archive contenant au minimum un fichier HTML et au besoin un ou plusieurs fichiers de données au format CSV et/ou un ou plusieurs fichiers de style CSS.

Exemples de réalisation
Inégalités des genres en Europe Sports d'hiver
XXX

A l'aide de l'application Adobe Color CC étudiez le schéma de couleur d'exemples de visualisation de données. Recherchez des exemples de visualisation de données correspondant à chacune des répartitions de couleur suivantes: semblable, monochrome, triade, complémentaire, composite. Expliquez lorsque c'est possible en quoi cette répartition vous parait ou non adaptée aux données qui sont visualisées.

Exemple de réalisation
schémas de couleurs
XXX

Créer un objet Json contenant la structure hiérarchique d'un répertoire de votre disque. Visualiser cet arbre en utilisant au moins deux méthodes implémentées dans d3.js.

Script python de création d'un objet JSON pour un répertoire: folder-to-json


XXX

Trouver 5 exemplesde visualisation illustrant les principes énoncés dans l'article et l'exposé "Narrative Visualization"

Narrative visualization talk

Narrative visualization slides

Narrative Visualization paper

 

Outils informatiques:

Exemples de scripts D3, Javascript et de fichiers SVG

Ces exemples sont des modifications d'exemples disponibles sur le site d3.js.

Archive contenant tous les exemples

Exemple minimal javascript JavaScriptExempleMinimal
Exemple minimal D3 D3_ExempleMinimal
Style déterminé par une fonction D3_StyleDetermineParUneFonction
Style déterminé par une fonction, exemple 2 D3_StyleDetermineParUneFonctionEx2
Création de noeuds dirigée par les données D3_CreationDeNoeudsParLesDonnees
Création de noeuds dirigée par les données, exemple 2 D3_CreationEtMiseAJourDeNoeuds
Style déterminé par des données D3_StyleEnFonctionDeDonnees
Graphique par colonnes D3_Chart
Graphique par colonnes, exemple 2 D3_ChartDecompose
SVG SVG_ExempleEnDur
SVG modifié par un script D3 SVG_D3
Lecture de données dans un fichier CSV D3_LectureCSV   MonFichierCSV  simple-cors-http-server.py
Création de noeuds à partir d'un fichier CSV D3_LectureCSV_Et_CreationNoeud  MonFichierCSV  simple-cors-http-server.py