Formation - Data Visualisation avec D3.js / Observable - La solution Open Source de référence
Créer des visualisations de données interactives et personnalisées
Transformez vos données en visualisations interactives avec D3.js et Observable
Apprenez à créer des graphiques dynamiques et modulables en combinant D3.js, Observable, HTML5, SVG, CSS3 et JavaScript, pour générer des visualisations claires, responsives et impactantes. Vous manipulez des données (CSV, JSON…), concevez des modèles graphiques efficaces, intégrez des interactions et réalisez des cartes interactives avec GeoJSON ou TopoJSON.
- Représenter des données sous forme graphique et interactive
- Exploiter les bibliothèques de codes prêts à l'emploi de D3.js
- Distinguer les interactions entre HTML 5, SVG, CSS 3, JavaScript.
- Utiliser D3.js et Observable pour manipuler des jeux de données
- Concevoir des graphiques dynamiques en SVG et JavaScript
- Publier des visualisations interactives.
- Journalistes
- Concepteurs Web
- Infographistes
- Développeurs.
Avoir une pratique courante de la navigation Web.
Jour 1
Présentation de D3.js / Observable
- A l'origine : Michael Bostock du trio de Stanford
- Data Journalisme : sélection d'exemples réalisés avec D3.js
- Pourquoi et comment utiliser D3.js ?
Initiation aux langages Web
- HTML, CSS : les standards du Web
- JavaScript / jQuery : programmer l'interactivité
- SVG : graphismes vectoriels avec HTML 5
Jour 2
Représentations graphiques avec D3.js
- Formes :
- Rectangles
- Cercles
- Lignes
- Polygones
- Personnalisation :
- Couleurs
- Marges
- Contours
- Remplissages
- Effets graphiques :
- Filtres
- Dégradés
- Ombres
Jour 3
D3.js / Observable par la pratique
- Etapes et méthodologie de travail
- Installation sur un serveur
- Dénicher, nettoyer, exploiter des fichiers de données Open Data de type CSV ou JSON
- Choisir un modèle de visualisation adéquat
- Gérer l'interactivité
- Responsive Design et mobile friendly
- Bonnes pratiques
Cartographie
- Formats GeoJSON et TopoJSON
- Créer des cartes interactives avec D3.js
Pour aller plus loin
- Sélection de tutoriels
- Ressources et bibliographies
- Association avec Angular et React
Exemple de travaux pratiques (à titre indicatif)
- Création d'un cahier des charges
Plusieurs dispositifs de financement sont accessibles via les OPCO (Opérateurs de Compétences), organismes agréés par le ministère du Travail dont le rôle est d’accompagner, collecter et gérer les contributions des entreprises au titre du financement de la formation professionnelle.
Pour plus d’information, une équipe de gestionnaires ABILWAYS spécialisée vous accompagne dans le choix de vos formations et la gestion administrative.
Équipe pédagogique :
Un consultant expert de la thématique et une équipe pédagogique en support du stagiaire pour toute question en lien avec son parcours de formation.
Techniques pédagogiques :
Pédagogie participative mettant l'apprenant au cœur de l'apprentissage. Utilisation de techniques ludo-pédagogiques pour une meilleure appropriation. Ancrage facilité par une évaluation continue des connaissances au moyen d'outils digitaux et/ou de cas pratiques.
Ressources pédagogiques :
Un support de formation présentant l'essentiel des points vus durant la formation et proposant des éléments d'approfondissement est téléchargeable sur notre plateforme.
