Séance 1 : Introduction à la visualisation de données et D3.js (3 heures)
- Théorie de la visualisation de données
- Importance et applications
- Principes de base de la conception visuelle
- Types de données et choix des graphiques appropriés
- Introduction à D3.js
- Présentation et installation
- Sélection et manipulation des éléments DOM
- Liaison des données aux éléments
Séance 2 : Création de visualisations avec D3.js (3 heures)
- Visualisations de base avec D3.js
- Graphiques à barres, linéaires et circulaires
- Utilisation des échelles et des axes
- Formatage des données
- Interactivité avec D3.js
- Ajout d'événements (mouseover, click)
- Transitions et animations de base
Séance 3 : Visualisations avancées et bonnes pratiques avec D3.js (3 heures)
- Visualisations complexes
- Nuages de points, diagrammes hiérarchiques, cartes choroplèthes
- Gestion des projections géographiques
- Optimisation et performance
- Gestion des grandes quantités de données
- Bonnes pratiques de codage avec D3.js
- Préparation des données
- Nettoyage et transformation des données avec JavaScript
Séance 4 : Introduction à Chart.js (3 heures)
- Présentation de Chart.js
- Avantages et cas d'utilisation
- Installation et configuration de base
- Création de graphiques avec Chart.js
- Graphiques linéaires, à barres, circulaires, radar, etc.
- Personnalisation des options de graphiques
- Interactivité et animations
- Ajout de légendes, info-bulles
- Animation des graphiques lors du chargement ou de la mise à jour
Séance 5 : Chart.js avancé et comparaison avec D3.js (3 heures)
- Personnalisation avancée
- Création de plugins personnalisés
- Gestion des données en temps réel
- Comparaison entre D3.js et Chart.js
- Quand utiliser l'un ou l'autre
- Intégration conjointe dans un projet
- Exportation et déploiement
- Préparation des visualisations pour le web
- Considérations pour la compatibilité entre navigateurs
Séance 6 : Intégration des visualisations dans React et Vue.js (3 heures)
- Introduction à React et Vue.js
- Présentation rapide des cadriciels
- Concepts clés pour l'intégration des visualisations
- Intégration avec React
- Création de composants pour D3.js et Chart.js
- Gestion de l'état et du cycle de vie des composants
- Intégration avec Vue.js
- Utilisation des directives et des composants Vue.js
- Communication entre les composants et gestion des props
- Bonnes pratiques et ressources pour aller plus loin
- Structuration du projet
- Optimisation des performances dans les cadriciels