Hoe ik dit heb gemaakt: Dynamische analyse met de lay-out container

Dit voorbeeld laat zien hoe u dynamische, interactieve werkbladinhoud kunt maken met de lay-out container.De lay-out container ondersteunt rasterloos ontwerp en gestapelde visualisaties, waardoor uitgebreide controle over de rangschikking van uw analyse-inhoud mogelijk is. Bovendien kunt u, net als bij andere containerobjecten, dynamisch verschillende informatie presenteren, afhankelijk van diverse voorwaarden, zoals variabele- en selectiestatussen.

Dit voorbeeld laat zien hoe u een lay-out container kunt bouwen om informatie van meerdere diagrammen als een enkel object te presenteren. Enkele algemene ontwerpaanpakken zijn:

Vergelijkbare objecten symmetrisch rangschikken, en styling gebruiken om verschillende secties van gegevens te onderscheiden.
Randen verwijderen van individuele objecten binnen de lay-out container, en vervolgens een rand toevoegen rond het gehele object wanneer voltooid.
Verschillende objecten of gegevens voorwaardelijk weergeven, afhankelijk van gebruikersinteractie—in dit voorbeeld, een staafdiagram waarin de gebruiker details kan tonen of verbergen.
Samengestelde elementen bouwen die bestaan uit meerdere verschillende objecten die naast elkaar zijn geplaatst—in dit voorbeeld, een interactieve knop die een aan/uit-schakelaar nabootst.
Meerdere manieren toestaan voor gebruikers om gegevens te selecteren en te filteren wanneer ze deze nader willen bekijken.

Voltooide lay-out container voor het voorbeeld — Eindresultaat

Voorbereidingen

Maak een nieuwe app en plak de Example load script in een nieuwe sectie in de Editor voor laden van gegevens. Laad vervolgens de gegevens.

After loading the data, switch to sheet view.

Example load script

SET DateFormat='M/D/YYYY';

Sales:

Load 

date(Now()-Offset,'MM/DD/YYYY') as [Order Date],

* Inline [

Order ID,Offset,Product Type,Shipment Status,Fulfillment Center,Sales,Late Status,Days Late
1,30,Electronics,Delivered,10036,9950,Not Late,
2,30,Office Supplies,Delivered,10036,4412,Not Late,
3,30,Office Supplies,Delivered,10038,7480,Late,3
4,30,Home Improvement,Delivered,10035,665,Late,4
5,30,Home Improvement,Delivered,10038,594,Not Late,
6,30,Home Improvement,Stalled,10038,8267,Not Late,
7,30,Clothing,Delivered,10035,1014,Not Late,
8,30,Cleaning Products,Delivered,10036,6999,Late,1
9,30,Electronics,Delivered,10036,733,Not Late,
10,29,Office Supplies,Delivered,10036,3487,Not Late,
11,29,Office Supplies,Delivered,10035,7343,Not Late,
12,29,Office Supplies,Delivered,10036,9239,Late,14
13,27,Cleaning Products,Delivered,10037,1463,Not Late,
14,27,Cleaning Products,Stalled,10035,4688,Not Late,
15,27,Home Improvement,Delivered,10038,5539,Late,2
16,27,Clothing,Delivered,10035,8388,Not Late,
17,27,Office Supplies,Delivered,10035,7560,Not Late,
18,27,Office Supplies,Delivered,10035,5738,Not Late,
19,27,Office Supplies,Delivered,10035,5469,Not Late,
20,26,Home Improvement,Delivered,10037,1435,Not Late,
21,26,Office Supplies,Delivered,10036,5962,Late,1
22,26,Clothing,Delivered,10035,4020,Late,7
23,26,Electronics,Delivered,10036,3888,Late,5
24,25,Office Supplies,Delivered,10037,6496,Not Late,
25,25,Clothing,Delivered,10038,4215,Late,11
26,25,Home Improvement,Delivered,10036,1801,Not Late,
27,25,Grocery,Delivered,10036,6471,Not Late,
28,24,Home Improvement,In Transit,10036,4578,Not Late,
29,24,Office Supplies,Cancelled,10037,3493,Not Late,
30,24,Office Supplies,Cancelled,10035,6572,Not Late,
31,24,Electronics,In Transit,10037,6691,Not Late,
32,24,Office Supplies,In Transit,10038,2721,Late,9
33,24,Grocery,In Transit,10035,8300,Not Late,
34,23,Grocery,In Transit,10035,840,Not Late,
35,23,Office Supplies,In Transit,10036,8972,Not Late,
36,23,Cleaning Products,Stalled,10036,9474,Not Late,
37,23,Home Improvement,In Transit,10038,1935,Not Late,
38,23,Office Supplies,In Transit,10036,1748,Not Late,
39,23,Seasonal,In Transit,10037,1948,Not Late,
40,22,Office Supplies,In Transit,10035,3121,Not Late,
41,22,Electronics,In Transit,10036,7377,Not Late,
42,22,Cleaning Products,In Transit,10037,1492,Not Late,
43,22,Office Supplies,Stalled,10037,7801,Late,6
44,22,Office Supplies,In Transit,10035,4663,Not Late,
45,22,Grocery,In Transit,10035,4649,Not Late,
46,21,Seasonal,In Transit,10038,2612,Not Late,
47,20,Clothing,In Transit,10036,8880,Late,4
48,20,Office Supplies,In Transit,10036,1391,Late,8
49,20,Cleaning Products,Cancelled,10037,1307,Not Late,
50,20,Home Improvement,In Transit,10037,6424,Not Late,
51,20,Grocery,In Transit,10035,5051,Not Late,
52,20,Cleaning Products,In Transit,10035,1286,Not Late,
53,19,Cleaning Products,In Transit,10038,8719,Not Late,
54,19,Office Supplies,In Transit,10037,8576,Not Late,
55,19,Seasonal,In Transit,10038,2866,Not Late,
56,19,Electronics,Stalled,10035,5186,Late,3
57,19,Clothing,In Transit,10038,4079,Not Late,
58,19,Office Supplies,In Transit,10038,706,Not Late,
59,19,Seasonal,In Transit,10036,6111,Not Late,
60,19,Clothing,In Transit,10036,5677,Not Late,
61,19,Home Improvement,In Transit,10037,3993,Not Late,
62,19,Office Supplies,In Transit,10037,1625,Not Late,
63,19,Seasonal,In Transit,10035,5805,Not Late,
64,19,Home Improvement,In Transit,10035,4453,Not Late,
65,19,Office Supplies,In Transit,10038,2252,Not Late,
66,18,Electronics,In Transit,10038,8362,Not Late,
67,18,Clothing,In Transit,10037,4182,Not Late,
68,18,Cleaning Products,In Transit,10038,9044,Not Late,
69,18,Clothing,In Transit,10035,6531,Not Late,
70,18,Office Supplies,In Transit,10035,8408,Not Late,
71,17,Home Improvement,Stalled,10038,9629,Not Late,
72,17,Seasonal,Preparation,10035,2128,Not Late,
73,17,Home Improvement,Cancelled,10038,1024,Not Late,
74,17,Office Supplies,Preparation,10037,9684,Late,2
75,17,Electronics,Preparation,10036,6753,Late,2
76,16,Clothing,Preparation,10036,3192,Not Late,
77,16,Office Supplies,Preparation,10038,3954,Not Late,
78,16,Office Supplies,Preparation,10035,8377,Not Late,
79,16,Office Supplies,Preparation,10038,2334,Not Late,
80,15,Grocery,Preparation,10037,7178,Not Late,
81,15,Office Supplies,Preparation,10037,1188,Not Late,
82,15,Electronics,Preparation,10035,4908,Not Late,
83,15,Electronics,Preparation,10035,3552,Not Late,
84,15,Clothing,Preparation,10037,875,Not Late,
85,14,Office Supplies,Preparation,10038,7886,Late,4
86,14,Home Improvement,Cancelled,10036,2358,Late,1
87,14,Clothing,Preparation,10037,8368,Not Late,
88,14,Grocery,Preparation,10037,142,Not Late,
89,14,Office Supplies,Preparation,10037,5537,Not Late,
90,14,Home Improvement,Preparation,10035,3231,Not Late,
91,14,Clothing,Preparation,10036,2283,Not Late,
92,14,Office Supplies,Preparation,10038,5952,Not Late,
93,13,Office Supplies,Preparation,10038,5513,Not Late,
94,13,Home Improvement,Preparation,10036,5871,Not Late,
95,13,Grocery,Preparation,10038,4425,Not Late,
96,13,Clothing,Preparation,10037,500,Late,1
97,13,Electronics,Preparation,10037,9792,Not Late,
98,13,Seasonal,Preparation,10035,4576,Not Late,
99,13,Office Supplies,Preparation,10038,228,Not Late,
100,13,Cleaning Products,Preparation,10037,3086,Late,1
101,13,Office Supplies,Preparation,10038,2329,Not Late,
102,12,Home Improvement,Preparation,10036,8862,Not Late,
103,12,Office Supplies,Preparation,10037,3991,Not Late,
104,12,Office Supplies,Preparation,10037,5435,Not Late,
105,12,Grocery,Preparation,10038,2476,Not Late,
106,12,Clothing,Preparation,10037,8362,Not Late,
107,12,Seasonal,Preparation,10035,1496,Not Late,
108,12,Electronics,Preparation,10038,3210,Not Late,
109,11,Clothing,Preparation,10038,7692,Not Late,
110,11,Cleaning Products,Preparation,10037,1585,Not Late,
111,11,Home Improvement,Cancelled,10037,1874,Not Late,
112,11,Office Supplies,Preparation,10037,869,Not Late,
113,11,Office Supplies,Preparation,10036,8578,Not Late,
114,10,Office Supplies,Preparation,10036,684,Not Late,
115,10,Electronics,Preparation,10036,9889,Not Late,
116,10,Office Supplies,Preparation,10036,4256,Not Late,
117,8,Seasonal,Preparation,10038,9288,Late,7
118,8,Office Supplies,Cancelled,10038,1534,Not Late,
119,8,Seasonal,Preparation,10038,7496,Not Late,
120,8,Electronics,Preparation,10036,8454,Late,3
121,8,Office Supplies,Stalled,10038,1063,Late,
122,8,Office Supplies,Preparation,10037,5958,Not Late,
123,8,Seasonal,Preparation,10036,686,Not Late,
124,8,Grocery,Preparation,10036,1799,Not Late,
125,8,Clothing,Stalled,10036,8485,Not Late,
126,7,Office Supplies,Preparation,10036,6451,Not Late,
127,7,Office Supplies,Pending,10036,1212,Not Late,
128,7,Electronics,Pending,10037,9037,Not Late,
129,7,Electronics,Pending,10037,6522,Late,20
130,7,Electronics,Pending,10038,8865,Late,4
131,7,Clothing,Cancelled,10036,7929,Not Late,
132,6,Seasonal,Pending,10038,9082,Not Late,
133,6,Office Supplies,Pending,10037,6563,Not Late,
134,6,Seasonal,Pending,10038,3513,Not Late,
135,5,Office Supplies,Pending,10035,2340,Not Late,
136,5,Cleaning Products,Pending,10035,590,Not Late,
137,5,Office Supplies,Pending,10035,542,Not Late,
138,5,Cleaning Products,Pending,10035,4809,Not Late,
139,5,Grocery,Cancelled,10035,1743,Not Late,
140,5,Office Supplies,Pending,10035,8312,Not Late,
141,4,Clothing,Pending,10035,5895,Not Late,
142,4,Clothing,Pending,10037,4882,Not Late,
143,4,Clothing,Pending,10037,9106,Not Late,
144,3,Office Supplies,Pending,10036,7422,Late,1
145,3,Clothing,Pending,10038,2686,Not Late,
146,3,Office Supplies,Pending,10037,698,Late,3
147,3,Office Supplies,Pending,10035,9514,Not Late,
148,2,Home Improvement,Pending,10037,6206,Late,2
149,2,Office Supplies,Pending,10035,9158,Not Late,
150,1,Electronics,Cancelled,10036,3204,Not Late,

];

drop field Offset;

Deel 1: Maak de variabele aan

Maak eerst de variabele aan. Deze variabele is het onderwerp van voorwaarden die later zullen worden toegevoegd. De waarden van de variabele worden tijdens de analyse gewijzigd door interacties met knopobjecten.

Maak de volgende variabele. Stel de Definitie in op =false().

vViewChartValues

Een variabele maken

Deel 2: De lay-outcontainer maken

Doe het volgende:

Open in het bedrijfsmiddelenvenster Aangepaste objecten > Dashboard bundle en sleep een Layout container naar het werkblad.
Wijzig het formaat van de container zodat deze 17 bij 10 vakjes is op het werkbladraster.

Deel 3: Visualisaties toevoegen aan de lay-outcontainer

Voeg vervolgens visualisaties toe aan de lay-outcontainer.

Doe het volgende:

Selecteer de lay-outcontainer.
In het eigenschappenvenster, onder Inhoud > Grafieken, klik op Toevoegen. Selecteer Knop.
Vouw het item uit. Stel het Label in op Button_NotLateTitle.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 9
Onder Positie stelt u het volgende in:
- X-as (%): 1
- Y-as (%): 1
Klik op Eigenschappen bewerken.
Vouw Acties en navigatie uit.
Klik op Actie toevoegen.
Voor de Actie selecteert u Waarden in een veld selecteren.
Voor het Veld selecteert u Late Status.
Voor Waarde klikt u op .
Voeg het volgende toe:
```
='Not Late'
```
Klik op Toepassen.
Vouw Uiterlijk > Algemeen uit.
Stel Not Late in als het Label.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Lay-outgedrag: Responsief
- Lettergrootte: Maximale waarde
- Letterkleur > Kleur: #006580
- Achtergrondopties > Gebruikte kleur: #ffffff
Klik op om het stijlpaneel te verlaten.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Onder Content > Charts, klik op Add. Selecteer Knop.
Vouw het item uit. Stel het Label in op Button_LateTitle.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 9
Onder Positie stelt u het volgende in:
- X-as (%): 51
- Y-as (%): 1
Klik op Eigenschappen bewerken.
Vouw Acties en navigatie uit.
Klik op Actie toevoegen.
Voor de Actie selecteert u Waarden in een veld selecteren.
Voor het Veld selecteert u Late Status.
Voor Waarde klikt u op .
Voeg het volgende toe:
```
='Late'
```
Klik op Toepassen.
Vouw Uiterlijk > Algemeen uit.
Stel Late in als het Label.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Lay-outgedrag: Responsief
- Lettergrootte: Maximale waarde
- Letterkleur > Kleur: #87205d
- Achtergrondopties > Gebruikte kleur: #ffffff
Klik op om het stijlpaneel te verlaten.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Onder Inhoud > Grafieken, klik op Toevoegen. Selecteer Meter.
Vouw het item uit. Stel het Label in op Gauge_NotLate.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 15
Onder Positie stelt u het volgende in:
- X-as (%): 1
- Y-as (%): 11
Klik op Eigenschappen bewerken.
Voeg Sum(Sales) toe als een meting.
Klik in het eigenschappenvenster, onder Gegevens > Filters, op Toevoegen.
Selecteer Late Status. Vouw het filter uit.
Behoud het standaard filtertype Waarden en schakel het selectievakje Not Late in. Dit filtert visualisatiegegevens tot alleen records die een Late Status-waarde van Not Late bevatten.
Vouw Uiterlijk > Algemeen uit.
Stel Titels weergeven in op Uit.
Vouw Uiterlijk > Presentatie uit.
Onder Bereiklimieten stelt u Max in op het volgende:
```
=Sum({1} Sales)
```
Wijzig de diagramconfiguratie van Radiaal naar Staaf.
Wijzig de Oriëntatie van Auto naar Aangepast, en zorg ervoor dat Horizontaal is geselecteerd.
Schakel Bibliotheek gebruiken uit, en stel de Kleur in op #006580.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de kleur in voor het Waardelabel op #ffffff.
Klik op om het stijlpaneel te verlaten.
Vouw Uiterlijk > Meetwaarde-as: Sum(Sales) uit.
Stel Labels en titel in op Geen.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Onder Inhoud > Grafieken, klik op Toevoegen. Selecteer Meter.
Vouw het item uit. Stel het Label in op Gauge_Late.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 15
Onder Positie stelt u het volgende in:
- X-as (%): 51
- Y-as (%): 11
Klik op Eigenschappen bewerken.
Voeg Sum(Sales) toe als een meting.
Klik in het eigenschappenvenster, onder Gegevens > Filters, op Toevoegen.
Selecteer Late Status. Vouw het filter uit.
Behoud het standaard filtertype Waarden en schakel het selectievakje Late in. Dit filtert visualisatiegegevens tot alleen records die een Late Status-waarde van Late bevatten.
Vouw Uiterlijk > Algemeen uit.
Stel Titels weergeven in op Uit.
Vouw Uiterlijk > Presentatie uit.
Onder Bereiklimieten stelt u Max in op het volgende:
```
=Sum({1} Sales)
```
Wijzig de diagramconfiguratie van Radiaal naar Staaf.
Wijzig de Oriëntatie van Automatisch naar Aangepast, en zorg ervoor dat Horizontaal is geselecteerd.
Schakel Bibliotheek gebruiken uit en stel de Kleur in op #87205d.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de kleur in voor het Waardelabel op #ffffff.
Klik op om het stijlpaneel te verlaten.
Vouw Uiterlijk > Meetwaarde-as: Sum(Sales) uit.
Stel Labels en titel in op Geen.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Klik onder Inhoud > Grafieken op Toevoegen. Selecteer KPI.
Vouw het item uit. Stel het Label in op KPI_NotLate.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 9
Onder Positie stelt u het volgende in:
- X-as (%): 1
- Y-as (%): 27
Klik op Eigenschappen bewerken.
Voeg Sum(Sales) toe als een meting.
Stel in de eigenschappen voor de meting de Getalnotatie in op Valuta.
Wijzig het Opmaakpatroon in:
```
$ #,##0.00;-$ #,##0.00
```
Klik in het eigenschappenvenster, onder Gegevens > Filters, op Toevoegen.
Selecteer Late Status. Vouw het filter uit.
Behoud het standaard filtertype Waarden en schakel het selectievakje Not Late in. Dit filtert visualisatiegegevens tot alleen records die een Late Status-waarde van Not Late bevatten.
Vouw Uiterlijk > Algemeen uit.
Stel Titels weergeven in op Uit.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Lay-outgedrag: Responsief
- Lettergrootte: Maximale waarde
- Schakel Eerste KPI-titel weergeven uit
Klik op om het stijlpaneel te verlaten.
Vouw Uiterlijk > Kleur uit.
Schakel Bibliotheekkleuren uit. Verander de kleur naar #006580.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Klik onder Inhoud > Grafieken op Toevoegen. Selecteer KPI.
Vouw het item uit. Stel het Label in op KPI_Late.
Onder Grootte stelt u het volgende in:
- Breedte (%): 48
- Hoogte (%): 9
Onder Positie stelt u het volgende in:
- X-as (%): 51
- Y-as (%): 27
Klik op Eigenschappen bewerken.
Voeg Sum(Sales) toe als een meting.
Stel in de eigenschappen voor de meting de Getalnotatie in op Valuta.
Wijzig het Opmaakpatroon in:
```
$ #,##0.00;-$ #,##0.00
```
Klik in het eigenschappenvenster, onder Gegevens > Filters, op Toevoegen.
Selecteer Late Status. Vouw het filter uit.
Behoud het standaard filtertype Waarden en schakel het selectievakje Late in. Dit filtert visualisatiegegevens tot alleen records die een Late Status-waarde van Late bevatten.
Vouw Uiterlijk > Algemeen uit.
Stel Titels weergeven in op Uit.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Lay-outgedrag: Responsief
- Lettergrootte: Maximale waarde
- Schakel Eerste KPI-titel weergeven uit
Klik op om het stijlpaneel te verlaten.
Vouw Uiterlijk > Kleur uit.
Schakel Bibliotheekkleuren uit. Stel de kleur in op #87205d.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Klik onder Inhoud > Diagrammen op Toevoegen. Selecteer Staafdiagram.
Vouw het item uit. Stel het Label in op BarChart_Simple.
Voor Weergavevoorwaarde, klik op .
Voeg het volgende toe:
```
=vViewChartValues=false()
```
Klik op Toepassen.
Onder Size, stel het volgende in:
- Breedte (%): 81
- Hoogte (%): 62
Onder Positie stelt u het volgende in:
- X-as (%): 1
- Y-as (%): 37
Klik op Eigenschappen bewerken.
Voeg Product Type toe als een dimensie.
Voeg nog een dimensie toe: Late Status.

Product Type moet nu worden vermeld als de Groep en Late Status als de Staven.
Voeg Sum(Sales) toe als een meting.
Stel in de eigenschappen voor de meting de Getalnotatie in op Valuta.
Wijzig het Opmaakpatroon in:
```
$ #,##0.00;-$ #,##0.00
```
Vouw Uiterlijk > Algemeen uit.
Stel Titels weergeven in op Uit.
Vouw Uiterlijk > Presentatie uit.
Schakel over van de Gegroepeerde naar de Gestapelde presentatie.
Stel Rasterlijnafstand in op Aangepast. Selecteer in de vervolgkeuzelijst Geen lijnen.
Klik op Stijl.
Stel onder Rand de Omtrek in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Aslabel lettergrootte: 16 px
Klik op om het stijlpaneel te sluiten.
Vouw Uiterlijk > Kleuren en legenda uit.

Stel Kleuren in op Aangepast > Op uitdrukking. Gebruik de volgende uitdrukking:

=if([Late Status]='Not Late','#006580', if([Late Status]='Late','#87205d'))

Stel Legenda tonen in op Uit.
Vouw Uiterlijk > x-as: Product Type, Late Status uit.
Stel Labels en titel in op Alleen labels.
Vouw Uiterlijk > Y-as: Sum(Sales) uit.
Stel Labels en titel in op Alleen labels.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Doe het volgende:

Onder Inhoud > Diagrammen klikt u met de rechtermuisknop op BarChart_Simple en klikt u op Dupliceren.
Vouw het item uit. Stel het Label in op BarChart_Detailed.
Voor Weergavevoorwaarde, klik op .
Voeg het volgende toe:
```
=vViewChartValues=true()
```
Klik op Toepassen.
Klik op Eigenschappen bewerken.
Vouw Uiterlijk > Presentatie uit.
Schakel Waardelabels in.
Schakel Segmentlabels in en zorg ervoor dat Totale labels zijn ingeschakeld.
Klik op Stijl.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Aslabel lettergrootte: 16 px
- Waardelabels lettergrootte: 14 px
Klik op om het stijlpaneel te sluiten.
Vouw Uiterlijk > Kleuren en legenda uit.
Vouw Uiterlijk > x-as: Product Type, Late Status uit.
Stel Labels en titel in op Alleen labels.
Vouw Uiterlijk > Y-as: Sum(Sales) uit.
Stel Labels en titel in op Alleen labels.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Maak drie mastervisualisaties die zullen worden gebruikt om een samengestelde schakelknop te bouwen in de lay-outcontainer. Deze tuimelschakelaar stelt gebruikers in staat om waardelabels in het staafdiagram aan en uit te zetten.

Item 1: Basis van de tuimelschakelaar

Doe het volgende:

Klik onder Inhoud > Grafieken op Toevoegen. Selecteer Knop.
Vouw het item uit. Stel het Label in op ToggleSwitch_Base.
Onder Grootte stelt u het volgende in:
- Breedte (%): 16
- Hoogte (%): 7
Onder Positie stelt u het volgende in:
- X-as (%): 83
- Y-as (%): 90
Klik op Eigenschappen bewerken.
Vouw Acties en navigatie uit.
Klik op Actie toevoegen.
Selecteer voor de Actie de optie Variabelewaarde instellen.
Selecteer voor Variabele de optie vViewChartValues.
Voor Waarde, klik op .

Voeg de volgende uitdrukking toe:

=if(vViewChartValues=false(),true(),if(vViewChartValues=true(),false()))

Klik op Toepassen.
Vouw Uiterlijk > Algemeen uit.
Stel Show Values in als het Label.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Onder Rand, stel Omtrek in op 2 px.
Stel de Rand kleur in op #000000.
Stel de Hoekradius voor de Rand in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Gedrag van de lay-out: Responsief
- Tekengrootte: 0.5
- Letterkleur > Kleur: #000000
- Achtergrondopties > Gebruikte kleur: #ffffff
Klik op om het stijlpaneel te verlaten.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Item 2: Knopgedeelte dat de AAN-status vertegenwoordigt

Doe het volgende:

Klik onder Inhoud > Grafieken op Toevoegen. Selecteer Knop.
Vouw het item uit. Stel het Label in op ToggleSwitch_ON.
Voor Weergavevoorwaarde, klik op .
Voeg het volgende toe:
```
=vViewChartValues=true()
```
Klik op Toepassen.
Onder Grootte stelt u het volgende in:
- Breedte (%): 4
- Hoogte (%): 7
Onder Positie stelt u het volgende in:
- X-as (%): 95
- Y-as (%): 90
Klik op Eigenschappen bewerken.
Vouw Acties en navigatie uit.
Klik op Actie toevoegen.
Selecteer voor de Actie de optie Variabelewaarde instellen.
Selecteer voor Variabele de optie vViewChartValues.
Voor Waarde, klik op .
Voeg de volgende uitdrukking toe:
```
=false()
```
Klik op Toepassen.
Vouw Uiterlijk > Algemeen uit.
Stel On in als het Label.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Onder Rand, stel Omtrek in op 2 px.
Stel de Rand kleur in op #000000.
Stel de Hoekradius voor de Rand in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Gedrag van de lay-out: Responsief
- Tekengrootte: 0.5
- Tekstkleur > Kleur: #ffffff
- Achtergrondopties > Gebruikte kleur: #109600
Klik op om het stijlpaneel te verlaten.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Item 3: Knopgedeelte dat de UIT-status vertegenwoordigt

Doe het volgende:

Onder Inhoud > Grafieken, klik op Toevoegen. Selecteer Knop.
Vouw het item uit. Stel het Label in op ToggleSwitch_ON.
Voor Weergavevoorwaarde, klik op .
Voeg het volgende toe:
```
=vViewChartValues=false()
```
Klik op Toepassen.
Onder Grootte stelt u het volgende in:
- Breedte (%): 4
- Hoogte (%): 7
Onder Positie stelt u het volgende in:
- X-as (%): 83
- Y-as (%): 90
Klik op Eigenschappen bewerken.
Vouw Acties en navigatie uit.
Klik op Actie toevoegen.
Selecteer voor de Actie de optie Variabelewaarde instellen.
Selecteer voor Variabele de optie vViewChartValues.
Voor Waarde, klik op .
Voeg de volgende uitdrukking toe:
```
=true()
```
Klik op Toepassen.
Vouw Uiterlijk > Algemeen uit.
Stel Off in als het Label.
Vouw Uiterlijk > Presentatie uit.
Klik op Stijl.
Onder Rand, stel Omtrek in op 2 px.
Stel de Rand kleur in op #000000.
Stel de Hoekradius voor de Rand in op 0 px.
Ga naar het tabblad Diagrammen. Stel de volgende eigenschappen in:
- Gedrag van de lay-out: Responsief
- Tekengrootte: 0.5
- Tekstkleur > Kleur: #ffffff
- Achtergrondopties > Gebruikte kleur: #ff001e
Klik op om het stijlpaneel te sluiten.
Klik op de bovenste staaf in het paneel om terug te keren naar de lay-outcontainer.

Deel 4: Presentatie afronden

Rond de lay-out container af door een titel en rand toe te voegen.

Doe het volgende:

Vouw in het eigenschappenvenster Uiterlijk > Algemeen uit.
Stel de titel in op Te laat vs. Niet-te-late orders - Impact op de verkoop.
Vouw Uiterlijk > Presentatie uit.
Schakel Diagram in bord houden in.
Klik op Stijl.
Stel de volgende eigenschappen in voor Rand:
- Omtrek: 2 px
- Kleur: #7b7a78
Stel de volgende eigenschappen in voor Schaduw:
- Gemiddelde grootte
- Kleur: #7b7a78

Resultaten

Sluit de bewerkingsmodus van het werkblad. Klik op de schakelknop om te wisselen tussen het eenvoudige en gedetailleerde staafdiagram.

Layout-container met 'Waarden weergeven' uitgeschakeld, waarbij het staafdiagram wordt gepresenteerd zonder waardelabels — Layout-container met Waarden weergeven uitgeschakeld

Layout-container met 'Waarden weergeven' ingeschakeld, waarbij het staafdiagram wordt gepresenteerd met waardelabels — Layout-container met Waarden weergeven ingeschakeld

Klik op de Not Late en Late titels bovenaan het diagram. Merk op dat het klikken op deze elementen de overeenkomstige waarden in de app selecteert.

Lay-outcontainer met selectie gemaakt in het veld 'Late Status'. — Lay-outcontainer met selectie Not Late in veld Late Status.

Was deze pagina nuttig?

Als u problemen ervaart op deze pagina of de inhoud onjuist is – een tikfout, een ontbrekende stap of een technische fout – laat het ons weten!

Geef hier uw feedback