Assembler un Tableau de Bord Interactif dans Tableau

@joekakone

Joseph Konka @joekakone

03/03/2026 · 8 min

tableau dashboard conteneurs actions interactivite ui-ux

Transformez des graphiques isolés en une application décisionnelle interactive : conteneurs horizontaux et verticaux (Tiled vs Floating), dimensions d'écran, filtres interactifs et actions croisées (Filter Actions).

Assembler le rapport

Avoir de magnifiques graphiques sur des feuilles séparées ne suffit pas : la valeur ajoutée d'un analyste réside dans sa capacité à les assembler au sein d'un Tableau de Bord interactif (Dashboard) permettant aux décideurs d'explorer les données par eux-mêmes en quelques clics.

1. Créer un tableau de bord et définir sa résolution#

En bas de votre écran Tableau, cliquez sur l'icône Nouveau tableau de bord (la grille à 4 cases située à côté des onglets de feuilles).

Dans le panneau gauche Tableau de bord, la première étape cruciale est de fixer la dimension d'affichage :

┌───────────────────────────────────────────────┐
│ TAILLE DU TABLEAU DE BORD                     │
│  ○ Automatique (S'adapte à tous les écrans)   │
│  ◉ Fixe : Navigateur standard (1366 x 768 px)  │
│                                               │
│  [ Concepteur d'appareils : Téléphone / PC ]  │
└───────────────────────────────────────────────┘

[!WARNING] Évitez le réglage "Automatique" en entreprise ! Même s'il semble attrayant, le mode automatique réorganise anarchiquement vos graphiques dès qu'un utilisateur ouvre le rapport sur un écran plus petit ou un rétroprojecteur. Privilégiez une taille fixe (ex. 1200 x 800 ou 1366 x 768) pour garantir un rendu pixel-perfect quel que soit l'écran.

2. Conteneurs de disposition : Juxtaposé (Tiled) vs Flottant (Floating)#

Pour positionner vos éléments sur la page, Tableau propose deux approches :

  • Juxtaposé (Tiled) : Les visuels s'emboîtent automatiquement comme des carreaux dans une grille stricte. Idéal pour structurer les grandes sections du rapport de manière propre et réactive.
  • Flottant (Floating) : Vous déplacez et dimensionnez librement les objets au pixel près (comme des calques Photoshop). Idéal pour positionner un logo d'entreprise, une carte de KPI isolée ou une légende.

Les Conteneurs Horizontaux et Verticaux#

Pour construire un layout professionnel, utilisez les Conteneurs (disponibles en bas du volet gauche) : * Conteneur Horizontal : Aligne les objets les uns à côté des autres (de gauche à droite). Indispensable pour votre rangée de KPI en haut de page. * Conteneur Vertical : Empile les blocs les uns en dessous des autres (de haut en bas).

┌────────────────────────────────────────────────────────────────────────┐
│ CONTENEUR VERTICAL PRINCIPAL                                           │
│ ┌────────────────────────────────────────────────────────────────────┐ │
│ │ En-tête : Titre exécutif du rapport + Sélecteur de date            │ │
│ └────────────────────────────────────────────────────────────────────┘ │
│ ┌────────────────────────────────────────────────────────────────────┐ │
│ │ CONTENEUR HORIZONTAL (KPIs)                                        │ │
│ │ ┌──────────────┐  ┌──────────────┐  ┌──────────────┐               │ │
│ │ │ Ventes (€)   │  │ Marge (%)    │  │ Commandes    │               │ │
│ │ └──────────────┘  └──────────────┘  └──────────────┘               │ │
│ └────────────────────────────────────────────────────────────────────┘ │
│ ┌────────────────────────────────────────────────────────────────────┐ │
│ │ CONTENEUR HORIZONTAL (CORPS)                                       │ │
│ │ ┌───────────────────────────┐  ┌─────────────────────────────────┐ │ │
│ │ │ Carte Géographique       │  │ Barres Sous-Catégories         │ │ │
│ │ │                           │  ├─────────────────────────────────┤ │ │
│ │ │                           │  │ Évolution Chronologique        │ │ │
│ │ └───────────────────────────┘  └─────────────────────────────────┘ │ │
│ └────────────────────────────────────────────────────────────────────┘ │
└────────────────────────────────────────────────────────────────────────┘

3. Assembler la structure du rapport#

  1. Glissez un Conteneur Horizontal tout en haut du tableau de bord.
  2. Déposez-y vos feuilles de KPI (KPI_Sales, KPI_Profit).
  3. Cliquez sur la flèche de chaque feuille de KPI et choisissez Ajuster > Vue entière pour que le chiffre occupe harmonieusement toute la case.
  4. Glissez un deuxième conteneur en dessous et déposez à gauche la feuille Map_Geographique et à droite les feuilles Bar_SousCategories et Evolution_Temporelle.
  5. Supprimez les légendes et conteneurs vides superflus pour maximiser l'espace utile réservé aux données.

4. Rendre le rapport interactif : Les Actions de Tableau de Bord#

Un tableau de bord devient captivant lorsque cliquer sur un graphique pilote automatiquement tous les autres.

Méthode rapide : Le bouton entonnoir#

En haut à droite du cadre de votre carte géographique, cliquez sur la petite icône d'Entonnoir (Utiliser comme filtre) : * Dès cet instant, cliquer sur un État (ex. la Californie) filtre instantanément les diagrammes à barres et les courbes de ventes pour n'afficher que les chiffres de la Californie !

Méthode experte : Le menu Tableau de bord > Actions#

Pour configurer des interactions sur mesure :

  1. Dans le menu supérieur, cliquez sur Tableau de bord > Actions....
  2. Cliquez sur Ajouter une action > Filtrer.
  3. Configurez les paramètres :
  4. Feuilles sources : Cochez la feuille qui sert d'élément déclencheur (ex. Bar_SousCategories).
  5. Exécuter l'action sur : Choisissez Sélection (au clic) ou Survol (au passage de la souris).
  6. Feuilles cibles : Cochez les graphiques qui doivent être mis à jour.
  7. La désélection efface les résultats : Cochez Afficher toutes les valeurs (pour réinitialiser le filtre dès qu'on désélectionne la barre).
Boîte de dialogue "Modifier l'action de filtre" :
┌────────────────────────────────────────────────────────┐
│ Nom de l'action : Filtre par Sous-Catégorie            │
├────────────────────────────────────────────────────────┤
│ Feuilles sources :   [☑ Bar_SousCategories           ] │
│ Exécuter sur :       ( ) Survol   (●) Sélection        │
│ Feuilles cibles :    [☑ Map_Geographique             ] │
│                      [☑ Evolution_Temporelle         ] │
│ Effacer la sélection:[●] Afficher toutes les valeurs   │
└────────────────────────────────────────────────────────┘

5. Bonnes pratiques de design (UI / UX)#

Pour donner un rendu élégant digne des meilleurs standards de Business Intelligence : * Palette de couleurs épurée : Utilisez une seule couleur d'accent vive pour mettre en valeur les éléments interactifs. Évitez les fonds noirs ou multicolores agressifs. * Aération (Padding) : Dans l'onglet Disposition, appliquez une marge intérieure (Inner Padding) de 8 px autour de chaque conteneur pour séparer élégamment les cartes sans surcharger de bordures noires. * Info-bulles soignées : Nettoyez les tooltips par défaut en supprimant les noms de champs techniques et en écrivant des phrases complètes (ex. "En Californie, les ventes de Chaises s'élèvent à 35 240 € pour un profit de 4 120 €").

6. Mise en pratique : Finaliser votre premier tableau de bord#

  1. Assemblez les 4 feuilles créées au chapitre précédent sur une zone fixe de 1300 x 850 px.
  2. Ajoutez un conteneur horizontal d'en-tête contenant un titre stylisé : "Tableau de bord de Performance Commerciale - Superstore".
  3. Activez l'interaction de filtre croisé sur la carte géographique et sur le graphique des sous-catégories.
  4. Testez le filtre : cliquez sur la sous-catégorie "Tables" et observez immédiatement la carte et la tendance temporelle s'ajuster à cette sélection !

Votre tableau de bord est finalisé, interactif et testé. Dans la dernière leçon technique, nous allons apprendre à publier et partager notre création en ligne sur Tableau Public.

Commentaires

Inscrivez-vous à une formation complète

Voir le catalogue