> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-metric.md). # AX - Indicateur ## Aperçu **AX - Metric** est un composant Experience Cloud qui affiche des valeurs calculées à partir des enregistrements Salesforce — comme les totaux, les moyennes, les décomptes et d’autres agrégations — sur les pages des sites Experience. Utilisez-le pour afficher en un coup d’œil aux utilisateurs du portail des indicateurs clés, comme leur total de commandes, le délai moyen de résolution des cas, le nombre de tickets ouverts, ou tout calcul personnalisé dérivé de leurs données. Configurez le libellé de l’indicateur, l’icône, le formatage et la source de données dans Experience Builder, sans code. Idéal pour les tableaux de bord du portail, les résumés de comptes, les tableaux de bord de performance, ou partout où les utilisateurs du portail doivent voir des chiffres clés sur leurs enregistrements sans exécuter de rapports. ## Prise en main Utilisez ce tutoriel simple pour apprendre les bases du composant Indicateur et commencer à créer vos cas d’usage. {% @arcade/embed url="" flowId="SXruKm5NX2h4AYOxH2EQ" %} ## Configuration ### **Libellé** Fournissez un libellé descriptif pour votre indicateur (par exemple, « Ventes totales », « Utilisateurs actifs »). Il sert de titre et donne du contexte à la valeur affichée.
### **Description** Offrez un contexte ou des informations supplémentaires liées à l’indicateur. Cela peut être une brève explication, une description de tendance ou des informations complémentaires pour faciliter la compréhension. ### **Valeur** Saisissez la valeur numérique principale de l’indicateur. Vous avez deux options : #### **Saisie manuelle** Saisissez directement la valeur si elle est facilement disponible. #### **Requête** Exploitez la puissance de Salesforce Object Query Language pour récupérer dynamiquement la valeur à partir de vos données Salesforce. Par exemple, vous pouvez calculer le nombre total de comptes créés cette année à l’aide d’une requête sur l’objet Compte.

Exemple : comptage des nouveaux comptes créés cette année

### **Valeur secondaire** Affichez un indicateur supplémentaire pour comparaison ou pour apporter davantage de contexte. Il peut s’agir de la valeur d’une période précédente, d’une valeur cible ou de tout autre point de données secondaire pertinent. ### **Préfixe et suffixe** Ajoutez des symboles ou des abréviations pour fournir du contexte. Par exemple, utilisez « $ » pour la devise, « # » pour les quantités ou « K » pour les milliers. La valeur secondaire possède son propre **Préfixe secondaire** et **Suffixe secondaire**. ### **Infobulle** Offrez plus de détails au survol. Expliquez brièvement l’indicateur ou fournissez des informations supplémentaires. ### **Avatar** Représentez visuellement l’indicateur avec une image, des initiales ou une icône. Cela rend l’indicateur plus reconnaissable et plus attrayant. ### **Formatage de l’indicateur principal et secondaire** Ajustez précisément l’affichage de vos valeurs d’indicateur : * **Style de format :** Décimal, devise, pourcentage - choisissez le format le plus adapté à vos données. * **Signe de la valeur :** Automatique, positif, négatif - contrôlez l’affichage des signes. * **Chiffres :** Spécifiez le nombre minimum et maximum de chiffres entiers et décimaux. * **Chiffres significatifs :** Arrondissez à un nombre précis de chiffres pour une meilleure lisibilité. * **Afficher la couleur de tendance :** Utilisez la couleur pour indiquer instantanément une tendance positive (verte) ou négative (rouge) Grâce à sa flexibilité et à sa large gamme d’options, le composant Avonni Metric vous permet de présenter des données complexes de manière simplifiée et percutante, ce qui en fait un atout précieux pour tout site Experience Cloud cherchant à fournir des informations exploitables à ses utilisateurs. ## Style {% tabs %} {% tab title="Alignement" %} Définissez le **Alignement** et **Alignement secondaire** du contenu de l’indicateur. {% endtab %} {% tab title="Libellé" %} * **Couleur / Taille de police / Style de police / Graisse de police / Réduction de ligne :** Stylisez le texte du libellé. {% endtab %} {% tab title="Description" %} * **Couleur / Taille de police / Style de police / Graisse de police / Réduction de ligne :** Stylisez le texte de description. {% endtab %} {% tab title="Valeur" %} * **Couleur / Taille de police / Style de police / Graisse de police / Hauteur de ligne :** Stylisez la valeur principale. {% endtab %} {% tab title="Préfixe et suffixe" %} * **Couleur / taille de police / style de police / graisse de police :** Stylisez le préfixe et le suffixe principaux. {% endtab %} {% tab title="Valeur secondaire" %} * **Couleur / taille de police / style de police / graisse de police :** Stylisez la valeur secondaire, le préfixe et le suffixe. {% endtab %} {% tab title="Tendance" %} * **Couleur négative / neutre / positive :** Définissez les couleurs de tendance pour la valeur principale. * **Tendance secondaire :** Définissez la couleur, la couleur d’arrière-plan et le rayon pour les tendances secondaires négatives, neutres et positives. {% endtab %} {% tab title="Avatar" %} * **Couleur d’arrière-plan / de premier plan de l’icône, bordure, initiales, alignement vertical :** Stylisez l’avatar de l’indicateur. {% endtab %} {% endtabs %} ## Cas d'utilisation ### Exemple 1 : montant des opportunités gagnées du compte {% @arcade/embed url="" flowId="KEG70at1gkiT4HyGtaBj" %} Mettez le chiffre d’affaires total des opportunités clôturées et gagnées au premier plan sur chaque page de compte, afin que les utilisateurs partenaires aient une vue immédiate de la valeur de la relation sans quitter l’enregistrement. *** #### **Ce que vous allez accomplir** * **Visibilité du chiffre d’affaires consolidé :** Affichez en temps réel la somme de tous les montants des opportunités clôturées et gagnées liées au compte, offrant aux partenaires un aperçu instantané de la valeur client. *** #### **Comment le configurer** {% stepper %} {% step %} #### **Ajoutez le composant à votre page** Glissez le composant AX – Metric dans Experience Builder sur la page de détails de votre compte. {% endstep %} {% step %} #### **Configurez la source de données** * Cliquez dans le champ Valeur et configurez une requête avec les paramètres suivants : * Nom API de l’objet : `Opportunity` * Champ : `Amount` * Fonction d’agrégation : `SUM` {% endstep %} {% step %} #### **Appliquer des filtres** Limitez la requête au compte actuel et aux opportunités gagnées uniquement : * ID du compte : `{!Item.Id}` * Étape : `Fermée gagnée` {% endstep %} {% step %} #### **Personnalisez l’affichage** * Définissez le libellé sur `Montant gagné` * Définissez l’icône de l’avatar sur `standard:opportunity` {% endstep %} {% step %} #### **Prévisualisez votre composant** * Utilisez l’aperçu d’Experience Builder pour confirmer que l’indicateur s’affiche correctement avant de publier. {% endstep %} {% endstepper %} *** #### **Liens** {% content-ref url="/pages/b9c32b869e2876f30d4232ad085d6b37ccf85dc2" %} [AX - Carte de profil](/experience-cloud/experience-cloud-fr/experience-components/ax-profile-card.md) {% endcontent-ref %} {% content-ref url="/pages/8e893d46776ae1dc01aa1b4b539eaf364fc8f2f9" %} [AX - Détail d'enregistrement](/experience-cloud/experience-cloud-fr/experience-components/ax-record-detail.md) {% endcontent-ref %} *** ### Exemple 2 : cas ouverts du compte {% @arcade/embed url="" flowId="S4TjnIAEL1dUly6hcTtg" %} Donnez aux utilisateurs partenaires un décompte en direct des cas non résolus directement sur la page du compte, afin qu’ils puissent évaluer rapidement la charge de support et prioriser leurs actions en conséquence. *** #### **Ce que vous allez accomplir** * **Nombre de cas ouverts en un coup d’œil :** Affichez le nombre total de cas actifs liés à un compte, ce qui aide les partenaires à rester informés de l’état du client sans passer par une liste séparée. *** #### **Comment le configurer** {% stepper %} {% step %} #### **Ajoutez le composant à votre page** Glissez le composant AX – Metric dans Experience Builder sur la page de détails de votre compte. {% endstep %} {% step %} #### **Configurez la source de données** * Cliquez dans le champ Valeur et configurez une requête avec les paramètres suivants : * Nom API de l’objet : `Cas` * Champ : `Id` * Fonction d’agrégation : `COUNT` {% endstep %} {% step %} #### **Appliquer des filtres** * Limitez la requête au compte actuel et aux cas ouverts uniquement : * ID du compte : `{!Item.Id}` * Fermé : `faux` {% endstep %} {% step %} #### **Personnalisez l’affichage** * Définissez le libellé sur `Cas ouverts` {% endstep %} {% step %} #### **Prévisualisez votre composant** * Utilisez l’aperçu d’Experience Builder pour confirmer que le décompte s’affiche correctement avant de publier. {% endstep %} {% endstepper %} --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-metric.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.