Exemples de volet de filtre

Cette rubrique d'aide fournit plusieurs exemples vous montrant comment personnaliser le style et d'autres propriétés dans les volets de filtre pour atteindre un certain nombre d'objectifs fonctionnels.

Exemple 1 — Conception condensée

Vous pouvez ajouter de nombreuses zones de liste à un volet de filtre, ce qui permet d'affiner les données selon de nombreuses dimensions différentes.

Pour économiser de l'espace et prioriser d'autres visualisations sur votre feuille, vous pouvez donner à votre volet de filtre une conception condensée dans laquelle le contenu est développé et réduit selon les besoins.

Procédez comme suit :

1. Créez une nouvelle application et collez Exemple de script de chargement dans une nouvelle section dans Éditeur de chargement de données. Chargez ensuite les données.

2. Basculez en mode feuille. Dans les propriétés de la feuille, définissez Espacement de la grille sur 42.

3. Faites glisser un volet de filtre sur la feuille.

4. Cliquez sur Ajouter une dimension. Sélectionnez Country.

5. Dans le panneau des propriétés, cliquez sur Ajouter un champ. Sélectionnez Item Type.

6. À l'aide du bouton Ajouter un champ, ajoutez quatre autres dimensions sous forme de zones de liste :

   • Order Year

   • Order Priority

   • Region

   • Sales Channel

7. Une par une, développez chaque zone de liste que vous venez d'ajouter et définissez Présentation > Réduire la zone de liste sur Toujours.

8. Ouvrez le panneau des propriétés et développez Aspect > Présentation.

9. Cliquez sur Styles.

10. Dans l'onglet Volet Filtre, définissez les propriétés suivantes :

    • Taille de police du Titre : 18 px

    • Couleur de police du Titre : code hexadécimal #ffffff

    • Couleur d'arrière-plan : code hexadécimal #87205d

    • Ombre : petite, code hexadécimal #000000

11. Dans l'onglet Zones de liste, définissez les propriétés suivantes :

    • Taille de police de l'En-tête : 14 px

12. Redimensionnez le volet de filtre sur un espace de deux par dix sur la grille de la feuille.

Passez en mode d'analyse. Vous pouvez développer les zones de liste selon les besoins pour effectuer des sélections.

Exemple 2 — Conception riche

Bien qu'un volet de filtre soit principalement utilisé pour filtrer les données, il peut également être utilisé pour visualiser les données. L'intégration d'une conception riche permet aux analystes d'obtenir des informations analytiques à mesure qu'ils effectuent différentes sélections.

Procédez comme suit :

1. Créez une nouvelle application et collez Exemple de script de chargement dans une nouvelle section dans Éditeur de chargement de données. Chargez ensuite les données.

2. Passez en mode feuille et faites glisser un Volet de filtre sur la feuille.

3. Cliquez sur Ajouter une dimension. Sélectionnez Item Type.

4. Cliquez sur la zone de liste Item Type pour développer ses propriétés.

5. Développez Présentation.

6. Activez le paramètre Histogramme.

7. Utilisez le menu déroulant Afficher la fréquence pour sélectionner Fréquence relative (%).

8. Définissez Réduire la zone de liste sur Jamais.

9. Développez Tri.

10. Définissez Tri sur Personnalisé.

11. Effacez toutes les options et activez Trier par expression.

12. Sélectionnez Décroissant.

13. Sous Expression, saisissez l'expression suivante :

    Count([Item Type])

14. Dans le panneau des propriétés, développez Aspect > Général.

15. Désactivez Afficher les titres.

16. Développez Aspect > Présentation.

17. Cliquez sur Styles.

18. Dans l'onglet Zones de liste, définissez les propriétés suivantes :

    • En-tête :

      • Police : Inter, sans-serif

      • Taille de police : 18 px

    • Contenu :

      • Police : Inter, sans-serif

19. Redimensionnez le volet de filtre en une petite forme rectangulaire, par exemple, trois carrés sur quatre.

Exemple 3 — Conception ciblée

La conception de votre volet de filtre peut dépendre de la manière dont vous souhaitez que les utilisateurs effectuent des sélections. Par exemple, vous pourriez souhaiter empêcher les utilisateurs d'utiliser certaines fonctionnalités pour encourager une interaction plus étroite et ciblée avec les données.

Les scénarios incluent :

• Le filtrage sur votre dimension particulière apporte le plus d'informations analytiques lorsque les valeurs sont sélectionnées une par une ou la sélection de plusieurs valeurs n'apporte aucune information analytique significative. Pour guider l'analyse de cette manière, vous pouvez désactiver la sélection de plage en utilisant le mode Cases à cocher.

• La recherche de valeurs dans le champ n'apporte aucune information ou n'est pas souhaitable.

• Vous souhaitez minimiser les distractions lors du filtrage des données — par exemple, la barre d'outils de sélection.

Procédez comme suit :

1. Créez une nouvelle application et collez Exemple de script de chargement dans une nouvelle section dans Éditeur de chargement de données. Chargez ensuite les données.

2. Passez en mode feuille et faites glisser un Volet de filtre sur la feuille.

3. Cliquez sur Ajouter une dimension. Sélectionnez Item Type.

4. Cliquez sur la zone de liste Item Type pour développer ses propriétés.

5. Définissez Recherche sur Masquer.

6. Désactivez Afficher la barre d'outils de sélection.

7. Développez Présentation.

8. Activez Mode Cases à cocher.

9. Dans le panneau des propriétés, développez Aspect > Général.

10. Désactivez Afficher les titres.

11. Redimensionnez le volet de filtre en une petite forme rectangulaire, par exemple, trois carrés sur quatre.

Exemple 4 — Conception de type grille

Vous pouvez utiliser le mode grille pour les volets de filtre qui utilisent de petits jeux de données définis. Par exemple, pour organiser des dimensions temporelles dans des grilles.

Procédez comme suit :

1. Créez une nouvelle application et collez Exemple de script de chargement dans une nouvelle section dans Éditeur de chargement de données. Chargez ensuite les données.

2. Passez en mode feuille et faites glisser un Volet de filtre sur la feuille.

3. Cliquez sur Ajouter une dimension. Sélectionnez Order Year.

4. Cliquez sur la zone de liste Order Year pour développer ses propriétés.

5. Désactivez Afficher les titres.

6. Développez Présentation.

7. Définissez Réduire la zone de liste sur Jamais.

8. Pour Afficher les données dans, sélectionnez Grille.

9. Définissez Colonnes visibles maxi. sur Personnalisé.

10. Définissez Colonnes maxi. sur 3.

11. Ajoutez Order Quarter comme zone de liste dans le volet de filtre.

12. Cliquez sur la zone de liste Order Quarter pour développer ses propriétés.

13. Désactivez Afficher les titres.

14. Développez Présentation.

15. Définissez Réduire la zone de liste sur Jamais.

16. Pour Afficher les données dans, sélectionnez Grille.

17. Définissez Trier par sur Colonnes.

18. Définissez Lignes visibles maxi. sur Personnalisé.

19. Définissez Colonnes maxi. sur 1.

20. Ajoutez Order Month comme zone de liste dans le volet de filtre.

21. Cliquez sur la zone de liste Order Month pour développer ses propriétés.

22. Désactivez Afficher les titres.

23. Développez Présentation.

24. Définissez Réduire la zone de liste sur Jamais.

25. Pour Afficher les données dans, sélectionnez Grille.

26. Définissez Colonnes visibles maxi. sur Personnalisé.

27. Définissez Colonnes maxi. sur 4.

28. Dans le panneau des propriétés, développez Aspect > Général.

29. Désactivez Afficher les titres.

30. Ouvrez le panneau des propriétés et développez Aspect > Présentation.

31. Cliquez sur Styles.

32. Dans l'onglet Volet Filtre, définissez les propriétés suivantes :

    • Couleur d'arrière-plan : #83af9b

33. Dans l'onglet Zones de liste, définissez les propriétés suivantes :

    • Contenu :

      • Police : Fredoka One, fantasy

      • Taille du texte : 15 px

      • Taille du texte : Gras

      • Couleur du texte : #000000

    • État de sélection > Possible : #000000

    • Couleur d'arrière-plan : #83af9b

34. Redimensionnez le volet de filtre à une taille qui convient bien à l'affichage — par exemple, trois sur trois.

Améliorations supplémentaires : volet de filtre composite avec le conteneur de disposition

Pour une meilleure réactivité et un meilleur contrôle, vous pourriez créer le volet de filtre ci-dessus sous la forme d'une série de trois volets de filtre intégrés dans un conteneur de disposition. L'image ci-dessous montre un exemple de ce à quoi cela pourrait ressembler.

Exemple 5 — Alignement sur la palette de couleurs de l'organisation

Vous pouvez définir le style des volets de filtre en fonction de la palette de couleurs de votre organisation. En plus de définir la couleur de l'arrière-plan et du texte, vous pouvez définir des chartes chromatiques pour les états de sélection de votre volet de filtre. Il se peut que vous souhaitiez que les sélections apparaissent dans les couleurs principales de la marque de votre entreprise plutôt que dans la couleur verte par défaut.

Avec les thèmes personnalisés, vous pouvez appliquer davantage la charte chromatique de votre organisation en définissant une couleur pour les sélections dans toutes les visualisations et la barre d'outils de sélection. Pour plus d'informations, consultez Thèmes personnalisés (uniquement en anglais).

Dans cet exemple, nous créons un volet de filtre reflétant les couleurs de la marque suivantes :

• Couleur principale : code hexadécimal #3100ff

• Couleur secondaire : code hexadécimal #9ba7ff

Procédez comme suit :

1. Créez une nouvelle application et collez l'exemple de données dans une nouvelle section dans Éditeur de chargement de données. Chargez ensuite les données.

2. Passez en mode feuille et faites glisser un Volet de filtre sur la feuille.

3. Cliquez sur Ajouter une dimension. Sélectionnez Item Type.

4. Dans le panneau des propriétés, cliquez sur Ajouter un champ. Sélectionnez Order Year.

5. À l'aide du bouton Ajouter un champ, ajoutez trois autres dimensions sous forme de zones de liste :

   • Order Priority

   • Region

   • Sales Channel

6. Dans le panneau des propriétés, développez Aspect > Général.

7. Désactivez Afficher les titres.

8. Développez Aspect > Présentation.

9. Cliquez sur Styles.

10. Dans l'onglet Volet Filtre, définissez les propriétés suivantes :

    • Ombre : petite, code hexadécimal #000000

11. Dans l'onglet Zones de liste, définissez les propriétés suivantes :

    • Taille de police de l'En-tête : 14 px

    • État de sélection :

      • Sélectionné: code hexadécimal #3100ff

      • Alternatif : code hexadécimal #9ba7ff

      • Exclu : #bebebe

      • Exclu sélectionné : #7b7a78

      • Possible : #ffffff

12. Redimensionnez le volet de filtre en une longue forme rectangulaire sur un côté de la feuille, par exemple, trois carrés sur douze.

Passez en mode d'analyse. Effectuez des sélections dans le volet de filtre pour afficher la charte chromatique.

Exemple de script de chargement

Sales:
LOAD 
Dual([Order Month Text], [Order Month Num]) as [Order Month],

* INLINE [
Order ID,Order Date,Order Year,Order Quarter,Order Month Text,Order Month Num,Region,Country,Item Type,Sales Channel,Order Priority,Ship Date,Units Sold,Unit Price,Unit Cost,Total Revenue,Total Cost,Total Profit
522840487,2/8/2021,2021,Q1,Feb,2,Central America and the Caribbean,Honduras,Household,Offline,H,2/13/2017,8974,668.27,502.54,5997054.98,4509793.96,1487261.02
832401311,2/19/2021,2021,Q1,Feb,2,Asia,Mongolia,Personal Care,Offline,C,2/23/2014,4901,81.73,56.67,400558.73,277739.67,122819.06
419123971,11/19/2021,2021,Q4,Nov,11,Asia,Sri Lanka,Cosmetics,Offline,M,12/18/2016,6952,437.2,263.33,3039414.4,1830670.16,1208744.24
441619336,12/30/2021,2021,Q4,Dec,12,Asia,Turkmenistan,Household,Offline,L,1/20/2011,3830,668.27,502.54,2559474.1,1924728.2,634745.9
795490682,6/30/2022,2022,Q2,Jun,6,Central America and the Caribbean,Honduras,Snacks,Online,L,7/26/2016,2225,152.58,97.44,339490.5,216804,122686.5
158535134,10/27/2022,2022,Q4,Oct,10,Australia and Oceania,Australia,Office Supplies,Online,C,11/25/2015,2924,651.21,524.96,1904138.04,1534983.04,369155
955357205,1/5/2022,2022,Q1,Jan,1,Europe,United Kingdom,Household,Online,L,2/14/2012,282,668.27,502.54,188452.14,141716.28,46735.86
259353148,4/7/2022,2022,Q2,Apr,4,Sub-Saharan Africa,Djibouti,Cosmetics,Offline,H,4/19/2014,7215,437.2,263.33,3154398,1899925.95,1254472.05
450563752,6/9/2022,2022,Q2,Jun,6,Australia and Oceania,Australia,Cereal,Offline,H,7/2/2013,682,205.7,117.11,140287.4,79869.02,60418.38
705784308,10/30/2022,2022,Q4,Oct,10,Middle East and North Africa,Libya,Clothes,Offline,H,11/17/2010,6116,109.28,35.84,668356.48,219197.44,449159.04
505716836,10/13/2022,2022,Q4,Oct,10,Central America and the Caribbean,Haiti,Cosmetics,Offline,H,11/16/2013,1705,437.2,263.33,745426,448977.65,296448.35
807025039,7/25/2023,2023,Q3,Jul,7,Central America and the Caribbean,Belize,Clothes,Offline,M,9/7/2016,5498,109.28,35.84,600821.44,197048.32,403773.12
166460740,10/24/2023,2023,Q4,Oct,10,Europe,Lithuania,Office Supplies,Offline,H,11/17/2010,8287,651.21,524.96,5396577.27,4350343.52,1046233.75
462405812,4/23/2023,2023,Q2,Apr,4,Asia,Turkmenistan,Office Supplies,Online,M,5/20/2013,5010,651.21,524.96,3262562.1,2630049.6,632512.5
816200339,8/14/2023,2023,Q3,Aug,8,Middle East and North Africa,Libya,Fruits,Online,L,9/30/2015,673,9.33,6.92,6279.09,4657.16,1621.93
555990016,5/20/2023,2023,Q2,May,5,Sub-Saharan Africa,Djibouti,Cereal,Online,H,6/17/2017,8656,205.7,117.11,1780539.2,1013704.16,766835.04
231145322,7/5/2023,2023,Q3,Jul,7,Middle East and North Africa,Pakistan,Cosmetics,Offline,L,8/16/2013,9892,437.2,263.33,4324782.4,2604860.36,1719922.04
986435210,11/6/2023,2023,Q4,Nov,11,North America,Mexico,Household,Offline,C,12/12/2014,6954,668.27,502.54,4647149.58,3494663.16,1152486.42
217221009,10/28/2023,2023,Q4,Oct,10,Australia and Oceania,Federated States of Micronesia,Beverages,Online,C,11/15/2014,9379,47.45,31.79,445033.55,298158.41,146875.14
670854651,7/20/2024,2024,Q3,Jul,7,Australia and Oceania,Samoa,Cosmetics,Online,H,8/7/2013,9654,437.2,263.33,4220728.8,2542187.82,1678540.98
213487374,10/21/2024,2024,Q4,Oct,10,Europe,Spain,Household,Offline,L,11/30/2012,4513,668.27,502.54,3015902.51,2267963.02,747939.49
663110148,9/18/2024,2024,Q3,Sep,9,Middle East and North Africa,Lebanon,Clothes,Online,L,10/8/2012,7884,109.28,35.84,861563.52,282562.56,579000.96
827844560,3/18/2024,2024,Q1,Mar,3,Sub-Saharan Africa,Kenya,Vegetables,Online,L,4/7/2012,6457,154.06,90.93,994765.42,587135.01,407630.41
430915820,2/17/2024,2024,Q1,Feb,2,North America,Mexico,Personal Care,Offline,L,3/20/2012,6422,81.73,56.67,524870.06,363934.74,160935.32
240470397,7/7/2024,2024,Q3,Jul,7,Australia and Oceania,Australia,Beverages,Offline,H,7/11/2014,9389,47.45,31.79,445508.05,298476.31,147031.74
559427106,7/30/2024,2024,Q3,Jul,7,North America,Mexico,Personal Care,Offline,M,8/8/2015,5767,81.73,56.67,471336.91,326815.89,144521.02
665095412,2/10/2025,2025,Q1,Feb,2,Sub-Saharan Africa,Mozambique,Household,Offline,L,2/15/2012,5367,668.27,502.54,3586605.09,2697132.18,889472.91
];

drop fields [Order Month Text], [Order Month Num];