> 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-de/experience-components/ax-metric.md). # AX - Metric ## Überblick **AX - Metrik** ist eine Experience-Cloud-Komponente, die berechnete Werte aus Salesforce-Datensätzen – wie Summen, Durchschnittswerte, Anzahlen und andere Aggregationen – auf Experience-Sites-Seiten anzeigt. Verwende sie, um Portalbenutzern wichtige Kennzahlen auf einen Blick zu zeigen, etwa ihre Gesamtbestellungen, die durchschnittliche Lösungszeit von Fällen, die Anzahl offener Tickets oder eine benutzerdefinierte Berechnung, die aus ihren Daten abgeleitet wurde. Konfiguriere die Kennzeichnungsbezeichnung, das Symbol, die Formatierung und die Datenquelle im Experience Builder ohne Code. Perfekt für Portal-Dashboards, Kontozusammenfassungen, Leistungsübersichten oder überall dort, wo Portalbenutzer wichtige Zahlen zu ihren Datensätzen sehen müssen, ohne Berichte auszuführen. {% hint style="info" %} **In einem echten Projekt ansehen** [Kontohervorhebungsbereich](https://docs.avonnicomponents.com/projects/use-cases/record-pages/account-highlight-panel): Ein benutzerdefinierter Hervorhebungsbereich mit Kennzahlen, Badges und einem Messinstrument. {% endhint %} ## Erste Schritte Verwende dieses einfache Tutorial, um die Grundlagen der Metrik-Komponente kennenzulernen und mit deinen Anwendungsfällen zu beginnen. {% @arcade/embed url="" flowId="SXruKm5NX2h4AYOxH2EQ" %} ## Konfiguration ### **Label** Gib deiner Metrik eine aussagekräftige Bezeichnung (z. B. „Gesamtumsatz“, „Aktive Benutzer“). Diese dient als Titel und gibt dem angezeigten Wert Kontext.
### **Beschreibung** Biete zusätzlichen Kontext oder weitere Einblicke zur Metrik. Das kann eine kurze Erklärung, eine Trendbeschreibung oder unterstützende Informationen sein, um das Verständnis zu verbessern. ### **Wert** Gib den primären Zahlenwert der Metrik ein. Du hast zwei Optionen: #### **Manuelle Eingabe** Gib den Wert direkt ein, wenn er leicht verfügbar ist. #### **Abfrage** Nutze die Leistungsfähigkeit der Salesforce Object Query Language, um den Wert dynamisch aus deinen Salesforce-Daten abzurufen. Du kannst beispielsweise die Gesamtzahl der in diesem Jahr erstellten Konten mithilfe einer Abfrage für das Account-Objekt berechnen.

Beispiel: Anzahl der in diesem Jahr erstellten neuen Konten

Der Wert kann auch anklickbar gemacht werden, damit Benutzer auf die Zahl reagieren können, die sie sehen – konfiguriere dies unter [Interaktionen](#interactions). ### **Sekundärer Wert** Zeige eine zusätzliche Metrik für den Vergleich oder weiteren Kontext an. Das kann der Wert eines vorherigen Zeitraums, ein Zielwert oder ein beliebiger relevanter sekundärer Datenpunkt sein. ### **Präfix & Suffix** Füge Symbole oder Abkürzungen hinzu, um Kontext bereitzustellen. Verwende zum Beispiel „$“ für Währungen, „#“ für Mengen oder „K“ für Tausend. Der sekundäre Wert hat ein eigenes **Sekundäres Präfix** und **Sekundäres Suffix**. ### **Tooltip** Biete beim Darüberfahren mehr Details an. Erkläre die Metrik kurz oder gib zusätzliche Einblicke. ### **Avatar** Stelle die Metrik visuell mit einem Bild, Initialen oder Symbol dar. Dadurch wird die Metrik erkennbarer und ansprechender. * **Bild:** Das anzuzeigende Bild. Akzeptiert `.apng`, `.avif`, `.gif`, `.jpg`, `.jpeg`, `.png`, `.svg`, und `.webp` Dateien. * **Name des Fallback-Symbols:** Das Lightning-Design-System-Symbol, das als Fallback verwendet wird, wenn das Bild nicht geladen werden kann. * **Initialen:** Buchstaben, die anstelle eines Bildes angezeigt werden. Wenn der Datensatzname aus zwei Wörtern besteht, wie Vor- und Nachname, verwende den ersten Großbuchstaben jedes Wortes. * **Position:** Wo der Avatar relativ zum Wert sitzt – Links (Standard), Rechts, Unten oder Oben. * **Alternativtext:** Text, der den Avatar beschreibt, wird als Hover-Text über dem Bild angezeigt und von assistiven Technologien vorgelesen. * **Größe:** X-Klein, Klein, Mittel (Standard), Groß, X-Groß oder XX-Groß. * **Variante:** Kreis oder Quadrat (Standard). ### **Formatierung der primären und sekundären Metrik** Feinabstimmung, wie deine Metrikwerte angezeigt werden. Jede dieser Einstellungen erscheint sowohl in den **Primäre Metrik** und **Sekundäre Metrik** Editoren, sodass die beiden Werte unabhängig voneinander formatiert werden können: * **Formatstil:** Dezimal (Standard), Prozent, Prozent fest oder Währung – wähle das beste Format für deine Daten. * **Währungscode:** Der ISO-4217-Code der anzuzeigenden Währung, zum Beispiel `USD` für den US-Dollar. Gilt nur, wenn **Formatstil** auf `Währung`. * **Währung anzeigen als:** Zeige die Währung als Symbol (Standard), Code oder Name an. Gilt nur, wenn **Formatstil** auf `Währung`. * **Vorzeichen des Werts:** Negativ (Standard) oder positiv – steuere, welches Vorzeichen vor dem Wert angezeigt wird. * **Ziffern:** Gib die minimale Anzahl an Ganzzahlziffern sowie die minimale und maximale Anzahl an Nachkommastellen an. * **Signifikante Ziffern:** Lege eine minimale und maximale Anzahl signifikanter Ziffern fest, auf die zur besseren Lesbarkeit gerundet wird. * **Trendfarbe anzeigen:** Verwende Farben, um positive (grün) oder negative (rot) Trends sofort anzuzeigen * **Trendsymbol:** Füge ein dynamisches Pfeil- oder Caret-Symbol hinzu, das die Trendrichtung des Werts anzeigt. Gilt nur, wenn **Trendfarbe anzeigen** aktiviert ist. * **Trend-Schwellenwert:** Die Zahl, bei der der Wert als neutral gilt. Funktioniert zusammen mit **Trendfarbe anzeigen** und **Trendsymbol**und gilt nur, wenn **Trendfarbe anzeigen** aktiviert ist. Der **Sekundäre Metrik** Editor fügt eine eigene Einstellung hinzu: * **Position:** Wo der sekundäre Wert relativ zum primären Wert sitzt – Unten, Links, Rechts (Standard) oder Oben. Mit ihrer Flexibilität und der Vielzahl an Optionen ermöglicht dir die Avonni Metric-Komponente, komplexe Daten auf vereinfachte und wirkungsvolle Weise darzustellen, und ist damit ein wertvolles Werkzeug für jede Experience-Cloud-Site, die ihren Benutzern verwertbare Einblicke bieten möchte. ## Interaktionen Der **Bei Klick** Einstellung macht einen Metrikwert anklickbar und legt fest, was geschieht, wenn ein Benutzer darauf klickt. Setze sie in den **Primäre Metrik** und **Sekundäre Metrik** Abschnitten des Metrik-Eigenschaftenbereichs im Experience Builder. Jeder Wert wird unabhängig konfiguriert, und ein Wert ohne **Bei Klick** Interaktion bleibt einfacher, nicht anklickbarer Text. Hier sind die verfügbaren Interaktionen für die Metrik-Komponente: * [Toast anzeigen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/show-toast.md) * [Navigieren](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/navigate.md) * [Alert-Modal öffnen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/open-alert-modal.md) * [Bestätigungsdialog öffnen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/open-confirm.md) * [Flow-Dialog öffnen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/open-flow-dialog.md) * [Flow ausführen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/execute-flow.md) * [Herunterladen](/experience-cloud/experience-cloud-de/eigenschaftenbereich/interactions/download.md) ### Klick auf primäre Metrik Wird ausgelöst, wenn ein Benutzer auf den primären Metrikwert klickt. Verwende dies, um zu einer Detailseite zu navigieren, einen Flow zu öffnen oder jede mit dem primären Wert verknüpfte Logik auszuführen. ### Klick auf sekundäre Metrik Wird ausgelöst, wenn ein Benutzer auf den sekundären Metrikwert klickt. Verwende dies, um eine separate Aktion für den sekundären Wert auszulösen – zum Beispiel Benutzer zu einem anderen Bericht zu leiten als der primäre Wert. ## Stil {% tabs %} {% tab title="Ausrichtung" %} Setze die **Ausrichtung** und **Sekundäre Ausrichtung** des Metrik-Inhalts. {% endtab %} {% tab title="Label" %} * **Farbe / Schriftgröße / Schriftstil / Schriftstärke / Zeilenbegrenzung:** Formatiere den Beschriftungstext. {% endtab %} {% tab title="Beschreibung" %} * **Farbe / Schriftgröße / Schriftstil / Schriftstärke / Zeilenbegrenzung:** Formatiere den Beschreibungstext. {% endtab %} {% tab title="Wert" %} * **Farbe / Schriftgröße / Schriftstil / Schriftstärke / Zeilenhöhe:** Formatiere den primären Wert. {% endtab %} {% tab title="Präfix & Suffix" %} * **Farbe / Schriftgröße / Schriftstil / Schriftstärke:** Formatiere das primäre Präfix und Suffix. {% endtab %} {% tab title="Sekundärer Wert" %} * **Farbe / Schriftgröße / Schriftstil / Schriftstärke:** Formatiere den sekundären Wert, das Präfix und das Suffix. {% endtab %} {% tab title="Trend" %} * **Negative / neutrale / positive Farbe:** Lege die Trendfarben für den primären Wert fest. * **Sekundärer Trend:** Lege die Farbe, Hintergrundfarbe und den Radius für negative, neutrale und positive sekundäre Trends fest. {% endtab %} {% tab title="Avatar" %} * **Symbol-Hintergrund-/Vordergrundfarbe, Rahmen, Initialen, vertikale Ausrichtung:** Formatiere den Metrik-Avatar. {% endtab %} {% endtabs %} ## Anwendungsfälle ### Beispiel 1: Gewinnbetrag gewonnener Opportunities des Kontos {% @arcade/embed url="" flowId="KEG70at1gkiT4HyGtaBj" %} Stelle den Gesamtumsatz aus abgeschlossenen, gewonnenen Deals auf jeder Kontoseite in den Mittelpunkt und gib Partnerbenutzern sofort einen Blick auf den Wert der Beziehung, ohne den Datensatz verlassen zu müssen. *** #### **Was du erreichen wirst** * **Sichtbarkeit des konsolidierten Umsatzes:** Zeige die Echtzeit-Summe aller abgeschlossenen, gewonnenen Opportunity-Beträge an, die mit dem Konto verknüpft sind, und gib Partnern so sofortige Einblicke in den Kundenwert. *** #### **So richtest du es ein** {% stepper %} {% step %} #### **Füge die Komponente zu deiner Seite hinzu** Ziehe die Komponente AX – Metric im Experience Builder auf deine Kontodetailseite. {% endstep %} {% step %} #### **Datenquelle konfigurieren** * Klicke in das Feld Value und richte eine Abfrage mit den folgenden Einstellungen ein: * Objekt-API-Name: `Opportunity` * Feld: `Betrag` * Aggregationsfunktion: `SUM` {% endstep %} {% step %} #### **Filter anwenden** Begrenze die Abfrage auf das aktuelle Konto und nur gewonnene Deals: * Konten-ID: `{!Item.Id}` * Phase: `Abgeschlossen gewonnen` {% endstep %} {% step %} #### **Anzeige anpassen** * Setze die Bezeichnung auf `Gewonnener Betrag` * Setze das Avatar-Symbol auf `standard:opportunity` {% endstep %} {% step %} #### **Komponente in der Vorschau anzeigen** * Verwende die Vorschau des Experience Builders, um zu bestätigen, dass die Metrik vor der Veröffentlichung korrekt gerendert wird. {% endstep %} {% endstepper %} *** #### **Links** {% content-ref url="/pages/54b24d7f0e3f517b74a9f5f342e0be72bcd75108" %} [AX - Profile Card](/experience-cloud/experience-cloud-de/experience-components/ax-profile-card.md) {% endcontent-ref %} {% content-ref url="/pages/a253f06b22ccd6ec4f2fe11cd4ee49a608cc1dce" %} [AX - Record Detail](/experience-cloud/experience-cloud-de/experience-components/ax-record-detail.md) {% endcontent-ref %} *** ### Beispiel 2: Offene Fälle des Kontos {% @arcade/embed url="" flowId="S4TjnIAEL1dUly6hcTtg" %} Gib Partnerbenutzern direkt auf der Kontoseite eine Live-Anzahl ungelöster Fälle, damit sie die Supportlast schnell einschätzen und ihre Ansprache entsprechend priorisieren können. *** #### **Was du erreichen wirst** * **Offene-Fälle-Anzahl auf einen Blick:** Zeige die Gesamtzahl der aktiven Fälle an, die mit einem Konto verknüpft sind, damit Partner über den Kundenstatus informiert bleiben, ohne zu einer separaten Liste navigieren zu müssen. *** #### **So richtest du es ein** {% stepper %} {% step %} #### **Füge die Komponente zu deiner Seite hinzu** Ziehe die Komponente AX – Metric im Experience Builder auf deine Kontodetailseite. {% endstep %} {% step %} #### **Datenquelle konfigurieren** * Klicke in das Feld Value und richte eine Abfrage mit den folgenden Einstellungen ein: * Objekt-API-Name: `Fall` * Feld: `Id` * Aggregationsfunktion: `ANZAHL` {% endstep %} {% step %} #### **Filter anwenden** * Begrenze die Abfrage auf das aktuelle Konto und nur offene Fälle: * Konten-ID: `{!Item.Id}` * Abgeschlossen: `falsch` {% endstep %} {% step %} #### **Anzeige anpassen** * Setze die Bezeichnung auf `Offene Fälle` {% endstep %} {% step %} #### **Komponente in der Vorschau anzeigen** * Verwende die Vorschau des Experience Builders, um zu bestätigen, dass die Anzahl vor der Veröffentlichung korrekt gerendert wird. {% 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 by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/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 what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. 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.