Het gebruiken van grafieken in Interactieve Communicatie using-charts-in-interactive-communications
Een grafiek of grafiek is een visuele weergave van gegevens. Het versleept grote hoeveelheden informatie in gemakkelijk-aan-begrijpelijke visuele formaat, toelatend de ontvangers van de Interactieve Mededeling om complexe gegevens beter te visualiseren, te interpreteren en te analyseren.
Terwijl het creëren van een Interactieve Communicatie, kunt u grafieken toevoegen om tweedimensionale gegevens van het de vormgegevensmodel van de Interactieve Communicatie visueel te vertegenwoordigen. Met de component Diagram kunt u de volgende typen grafieken toevoegen en configureren: Schijf, Kolom, Donut, Staaf, Lijn, Lijn en Punt, Punt, Gebied en Kwadrant.
Voeg en vorm grafiek in een Interactieve Communicatie toe add-and-configure-chart-in-an-interactive-communication
Voer de volgende stappen uit om een grafiek in een Interactieve Mededeling toe te voegen en te vormen:
-
Selecteer Componenten van het hulpje van de Interactieve Communicatie.
-
Sleep en laat vallen de component van de Grafiek aan één van de volgende componenten:
- Kanaal afdrukken: doelgebied of afbeeldingsveld
- Webkanaal: Deelvenster of Doelgebied
-
Selecteer de grafiekcomponent in de Interactieve Communicatie redacteur en selecteer Configure ( ) van de toolbar van de Component.
De grafiekeigenschappen worden in het linkerdeelvenster weergegeven.
Basiseigenschappen van een lijntekstdiagram in een afdrukkanaal
Basiseigenschappen van een lijntekstdiagram in een webkanaal
-
Vorm de grafiekeigenschappendie op het kanaaltype worden gebaseerd.
-
(Alleen kanaal afdrukken) Geef in de Agent Settings op of de agent dit diagram moet gebruiken. Als i t Is Mandatory For the Agent To Use This Chart optie niet wordt geselecteerd, kan de agent het oogpictogram voor de grafiek in het Content lusje van de UI van de Agent selecteren om de grafiek te tonen of te verbergen.
-
Selecteer om de grafiekeigenschappen te bewaren.
Selecteer Preview om de weergave en de gegevens weer te geven die aan het diagram zijn gekoppeld. Selecteer Edit om de eigenschappen van het diagram opnieuw te configureren.
Eigenschappen van diagram configureren configure-chart-properties
Configureer de volgende eigenschappen tijdens het maken van grafieken voor afdrukken en webkanalen:
Functies in diagram gebruiken use-functions-in-chart
U kunt een grafiek vormen om statistische functies te gebruiken om waarden van de brongegevens voor het tekenen op de grafiek te berekenen. Door functies in een grafiek toe te passen, kunt u gegevens plotten die niet direct door het model van vormgegevens worden verstrekt.
Terwijl de component van de Grafiek met sommige in-gebouwde functies komt, kunt u douanefunctiesschrijven en hen voor gebruik in de grafiekconfiguratie in het Webkanaal ter beschikking stellen.
De volgende functies zijn standaard beschikbaar met de component Chart:
Gemiddeld (Gemiddeld) keert het gemiddelde van de waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
Som keert de som alle waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
Maximum keert het maximum van de waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
Frequentie keert het aantal waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
Waaier keert het verschil tussen het maximum en het minimum van de waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
Mediaan keert de waarde terug die hogere en lagere waarden in de helft op X of de as van Y voor een bepaalde waarde op de andere as scheidt.
Minimum keert het minimum van de waarden op X of de as van Y voor een bepaalde waarde op de andere as terug.
de Wijze keert de waarde met de meeste voorkomen op X of de as van Y voor een bepaalde waarde op de andere as terug.
Voor meer informatie, zie Voorbeeld 2: De toepassing van Som en de functies van de Frequentie in een lijngrafiek.
Aangepaste functies in webkanaal customfunctionsweb
Naast het gebruik van de standaardfuncties in grafieken, kunt u douanefuncties in JavaScript™ schrijven en hen ter beschikking stellen in de lijst van functies in de component van de Grafiek voor Webkanaal.
Een functie neemt een array of waarden en een categorienaam als invoer en retourneert een waarde. Bijvoorbeeld:
Multiply(valueArray, category) {
var val = 1;
_.each(valueArray, function(value) {
val = val * value;
});
return val;
}
Zodra u een douanefunctie hebt geschreven, doe het volgende om het voor gebruik in de grafiekconfiguratie beschikbaar te maken:
-
Voeg de douanefunctie in de cliëntbibliotheek toe verbonden aan de relevante Interactieve Communicatie. Voor meer informatie, zie Vormend de Submit actieen Gebruikend Cliënt-Kant Bibliotheken.
-
Als u de aangepaste functie wilt weergeven in de vervolgkeuzelijst Functie, maakt u in CRXDe Lite een knooppunt
nt:unstructured
in de map apps met de volgende eigenschappen:-
Voeg eigenschap
guideComponentType
toe met waarde alsfd/af/reducer
. (verplicht) -
Voeg eigenschap
value
toe aan een volledig gekwalificeerde naam van de aangepaste JavaScript™-functie. (verplicht) en de waarde ervan instellen op de naam van de aangepaste functie, zoals Vermenigvuldigen. -
Voeg eigenschap
jcr:description
toe met de waarde die u wilt weergeven als de naam van de aangepaste functie die wordt weergegeven in de vervolgkeuzelijst Functie. Bijvoorbeeld, vermenigvuldigt. -
Voeg eigenschap
qtip
toe met een waarde die een korte beschrijving van de aangepaste functie is. Het verschijnt als tooltip wanneer het bedekken van wijzer over de functienaam in de drop-down lijst van de Functie.
-
-
Klik sparen allen om de configuratie te bewaren.
De functie is nu beschikbaar voor gebruik in de Grafiek.
Voorbeeld 1: Grafiekuitvoer in gedrukte vorm en op het web chartoutputprintweb
Op het tabblad Standaard definieert u het type grafiek, de eigenschappen van het gegevensmodel van het bronformulier die gegevens bevatten, de labels die moeten worden getekend op de X-as en Y-as van het diagram en eventueel de statistische functie die de waarden voor tekenen op het diagram berekent.
Laten we de minimaal vereiste informatie in basiseigenschappen in detail begrijpen, met behulp van een kaartinstructie die is gegenereerd met een interactieve communicatie. Bedenk dat u een grafiek wilt produceren om de hoeveelheid verschillende uitgaven in de verklaring te schilderen. U wilt verschillende soorten grafieken voor druk en Weboutput van de Interactieve Communicatie gebruiken.
Kolomdiagram voor afdrukken columnchartprint
Hiervoor geeft u de volgende eigenschappen op:
- Name - Geef de naam voor het diagram op.
- Chart Type - selecteer Kolom van de drop-down lijst.
- Title - Geef het type kosten op voor de X-as en de hoeveelheid transacties voor de Y-as.
- Data Model Objects - Selecteer de eigenschappen van het gegevensmodelobject om gegevensbindingen te maken voor de X-as (Type kosten) en de Y-as (Hoeveelheid transactie).
Kolomdiagram in het afdrukkanaal van een interactieve communicatie
Donut-diagram voor web donutchartweb
Hiervoor geeft u de volgende eigenschappen op:
- Name - Geef de naam voor het diagram op.
- Chart Type - Selecteer Donut in de vervolgkeuzelijst.
- Data Model Objects - Selecteer de eigenschappen van het gegevensmodelobject om gegevensbindingen te maken voor de X-as (Type kosten) en de Y-as (Hoeveelheid transactie).
- Inner Radius - Geef de waarde voor Binnenste straal op als 150 om de straal (in pixels) van de binnenste cirkel in het diagram op te geven.
- Tooltip - gebruik $ {x} ($ {y}) standaardformaat om tooltip te tonen. De knopinfo wordt weergegeven als: Type kosten (transactiebedrag). Voorbeeld: Debit voor bitmap (10000).
Donut grafiek in het Webkanaal van een Interactieve Mededeling
Voorbeeld 2: De toepassing van de functies van de Som en van de Frequentie in een lijngrafiek applicationsumfrequency
Door functies in een grafiek toe te passen, kunt u gegevens plotten die niet direct door het model van vormgegevens worden verstrekt. In dit voorbeeld, gebruiken wij een voorbeeld van de creditcardverklaring om te begrijpen hoe de functies van de Som en van de Frequentie op de grafiek kunnen worden toegepast.
Regeldiagram zonder functie met twee "Debit for AirBnB"-transacties
Sum, functie sum-function
U kunt de functie sum toepassen om waarden van meerdere instanties van dezelfde gegevenseigenschap op te tellen en deze slechts eenmaal weer te geven. In de volgende grafiek wordt bijvoorbeeld de functie Som toegepast op de Y-as om het bedrag van de twee Debit voor AirBnB-transacties (2050 en 1050) op te tellen en slechts één transactie (3100) weer te geven.
De functie van de som kan grafiek nuttiger maken wanneer u som voor vele instanties van het zelfde gegevensbezit wilt sorteren en tonen.
Frequentiefunctie frequency-function
De functie Frequentie retourneert het aantal waarden Y-as voor een bepaalde waarde op de andere as. Met de toepassing van de Frequentiefunctie op de Y-as (Transactiesom) toont de grafiek dat er twee exemplaren van de Debit voor AirBnB-transacties zijn geweest en één exemplaar van de rest van de soorten transacties.
Voorbeeld 3: Quadrant-diagram met meerdere reeksen in het web example-multi-series-quadrant-chart-in-web
De grafiek geeft een overzicht van het bedrag voor transacties die in een bepaald datumbereik worden uitgevoerd. Het diagram van het kwadrant biedt de mogelijkheid om het grafiekgebied te verdelen in vier gelabelde secties. Het teken gebruikt een statisch referentiepunt voor de X- en Y-as. Gebruik de functie voor meerdere reeksen om gegevens te scheiden op basis van de naam van de bank.
Hiervoor geeft u de volgende eigenschappen op:
-
Naam: specificeer de naam voor de grafiek.
-
Type van Grafiek: Uitgezochte Kwadrant van de drop-down lijst.
-
Selecteer Veelvoudige Reeks checkbox.
-
ModelVoorwerp van Gegevens: Specificeer het bezit van het gegevensmodel voor de reeks. De objecteigenschap van het gegevensmodel voor de naam van de bank is een bovenliggend element van de eigenschappen van het gegevensmodel die zijn getekend in de X-as en Y-as.
-
Modelvoorwerpen van Gegevens: selecteer de eigenschappen van het gegevensmodel om gegevensbanden voor x-as (de Datum van de Transactie) en y-as (het Bedrag van de Transactie) tot stand te brengen.
-
In de sectie van het Punt van de Verwijzing, uitgezochte Statische als Bindend Type.
-
Geef de waarden op voor de referentiepunten op de X-as en de Y-as.
-
Geef de kwadranslabels op voor de kwadranten Linksboven, Rechtsboven, Rechtsonder en Linksonder.
-
Selecteer tonen legenda checkbox om de kleurencodes voor de banknamen te tonen.