Ajouter un graphique donut à une page

Dans ce tutoriel, vous allez ajouter un graphique donut à une page d'application pour visualiser la répartition de plusieurs valeurs sous forme d'anneau, par exemple la répartition des statuts d'une liste de commandes.

1. Ajouter un composant Donut

Sur une page de votre application, glissez le bloc Donut, situé dans la section Graphiques et visualisation de la barre latérale des composants, vers un container de la page.

2. Renseigner le titre et le sous-titre

Complétez les champs Titre et Sous-titre pour indiquer ce que représente le graphique.

3. Ajouter vos parts

Dans la section Valeurs du graphique, ajoutez une série pour chaque part de l'anneau.

Renseignez le Libellé du graphique de chaque série, puis associez-la à une donnée dynamique.

4. Choisir une couleur pour chaque part

Cliquez sur le carré de couleur à côté de chaque série pour ouvrir le sélecteur de couleur et choisir une teinte distincte.

Résultat

Le donut affiche un segment d'anneau par série, dont la taille est proportionnelle à sa valeur par rapport au total. Il se met à jour automatiquement lorsque les données sources changent.

Pour aller plus loin

• Ajouter un graphique camembert à une page
• Ajouter un graphique en barres radiales
• Filtrer les données affichées dans un composant