Bunu nasıl yaptım: Düzen kapsayıcısı ile dinamik analiz

Bu örnek, düzen kapsayıcısı ile dinamik, etkileşimli sayfa içeriği oluşturmayı nasıl yapabileceğinizi gösterir.Düzen kapsayıcısı, kılavuz çizgisiz tasarımı ve yığın görselleştirmeleri destekleyerek analiz içeriğinizin düzenlenmesi üzerinde kapsamlı kontrol sağlar. Ek olarak, diğer kapsayıcı nesnelerde olduğu gibi, değişken ve seçim durumları gibi çeşitli koşullara bağlı olarak farklı bilgileri dinamik olarak sunabilirsiniz.

Bu örnek, birden çok grafikten gelen bilgileri tek nesne olarak sunmak için bir düzen kapsayıcısı oluşturabileceğinizi gösterir. Bazı genel tasarım yaklaşımları şunlardır:

Benzer nesneleri simetrik bir şekilde düzenlemek, farklı veri bölümlerini ayırt etmek için stil kullanmak.
Düzen kapsayıcısının içindeki tek tek nesnelerden kenarlıkları kaldırmak ve ardından işlem bittiğinde tüm nesnenin etrafına bir kenarlık eklemek.
Kullanıcı etkileşimine bağlı olarak farklı nesneleri veya verileri koşullu olarak görüntülemek; bu örnekte, kullanıcının ayrıntıları gösterebileceği veya gizleyebileceği bir sütun grafik.
Birden çok farklı nesnenin yan yana yerleştirildiği bileşik öğeler oluşturmak; bu örnekte, açma/kapama anahtarını taklit eden etkileşimli bir düğme.
Kullanıcıların daha yakından incelemeleri gerektiğinde verileri seçmeleri ve filtrelemeleri için birden fazla yol sunma.

Örnek için bitmiş düzen kapsayıcısı — Nihai sonuç

Hazırlıklar

Yeni bir uygulama oluşturun ve Örnek komut dosyası öğesini Veri yükleme düzenleyicisi içindeki yeni bir bölüme yapıştırın. Ardından verileri yükleyin.

Verileri yükledikten sonra sayfa görünümüne geçin.

Örnek komut dosyası

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;

Bölüm 1: Değişkeni oluşturma

İlk olarak, değişkeni oluşturun. Bu değişken, daha sonra eklenecek koşulların konusudur. Değişkenin değerleri, analiz sırasında düğme nesneleriyle etkileşimler yoluyla değiştirilecektir.

Aşağıdaki değişkeni oluşturun. Tanım öğesini =false() olarak ayarlayın.

vViewChartValues

Değişken oluşturma

Bölüm 2: Düzen kapsayıcısını oluşturun

Aşağıdakileri yapın:

Varlıklar panelinde, Özel nesneler > Dashboard bundle öğesini açın ve bir Layout container öğesini sayfaya sürükleyin.
Kapsayıcıyı sayfa kılavuz çizgisinde 17'ye 10 kare olacak şekilde yeniden boyutlandırın.

Bölüm 3: Düzen kapsayıcısına görselleştirmeler ekleme

Ardından, düzen kapsayıcısına görselleştirmeler ekleyin.

Aşağıdakileri yapın:

Düzen kapsayıcısını seçin.
Özellikler panelinde, İçerik > Grafikler altında, Ekle'ye tıklayın. Düğme'yi seçin.
Öğeyi genişletin. Etiket'i Button_NotLateTitle olarak ayarlayın.
Boyut altında, aşağıdakileri ayarlayın:
- Genişlik (%): 48
- Yükseklik (%): 9
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 1
- Y ekseni (%): 1
Özellikleri düzenle öğesine tıklayın.
Eylemler ve navigasyon öğesini genişletin.
İşlem ekle'ye tıklayın.
Eylem için, Bir alandaki değerleri seç öğesini seçin.
Alan için, Late Status öğesini seçin.
Değer için, öğesine tıklayın.
Aşağıdakileri ekleyin:
```
='Not Late'
```
Uygula'ya tıklayın.
Görünüş > Genel öğesini genişletin.
Not Late öğesini Etiket olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Sınır altında, Anahat'ı 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: Maksimum değer
- Yazı tipi rengi > Renk: #006580
- Arka plan seçenekleri > Kullanılan renk: #ffffff
Stil panelinden çıkmak için öğesine tıklayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle öğesine tıklayın. Düğme öğesini seçin.
Öğeyi genişletin. Etiket öğesini Button_LateTitle olarak ayarlayın.
Boyut altında, aşağıdakileri ayarlayın:
- Genişlik (%): 48
- Yükseklik (%): 9
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 51
- Y ekseni (%): 1
Özellikleri düzenle'ye tıklayın.
Genişlet Eylemler ve navigasyon.
İşlem ekle'ye tıklayın.
Eylem için Bir alandaki değerleri seç öğesini seçin.
Alan için Late Status öğesini seçin.
Değer için öğesine tıklayın.
Aşağıdakileri ekleyin:
```
='Late'
```
Uygula'ya tıklayın.
Görünüş > Genel öğesini genişletin.
Late'i Etiket olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Kenarlık altında, Anahat'ı 0 px olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: Maksimum değer
- Yazı tipi rengi > Renk: #87205d
- Arka plan seçenekleri > Kullanılan renk: #ffffff
Stil panelinden çıkmak için öğesine tıklayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle öğesine tıklayın. Gösterge öğesini seçin.
Öğeyi genişlet. Etiket değerini Gauge_NotLate olarak ayarla.
Boyut altında, aşağıdakileri ayarla:
- Genişlik (%): 48
- Yükseklik (%): 15
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 1
- Y ekseni (%): 11
Özellikleri düzenle'ye tıklayın.
Hesaplama olarak Sum(Sales) öğesini ekleyin.
Özellikler panelinde, Veri > Filtreler altında, Ekle'ye tıklayın.
Late Status öğesini seçin. Filtreyi genişletin.
Varsayılan Değerler filtre türünü koruyun ve Not Late onay kutusunu işaretleyin. Bu, görselleştirme verilerini yalnızca Late Status değeri Not Late içeren kayıtlara göre filtreler.
Görünüş > Genel öğesini genişletin.
Başlıkları göster seçeneğini Kapalı olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Aralık sınırları altında, Maks değerini aşağıdaki gibi ayarlayın:
```
=Sum({1} Sales)
```
Grafik yapılandırmasını Radyal'dan Çubuk'a değiştirin.
Yönlendirme'yi Otomatik'ten Özel'e değiştirin ve Yatay'ın seçili olduğundan emin olun.
Kitaplığı kullan seçeneğini kapatın ve Renk'i #006580 olarak ayarlayın.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Değer etiketi için rengi #ffffff olarak ayarlayın.
Stil panelinden çıkmak için 'e tıklayın.
Görünüş > Hesaplama ekseni: Sum(Sales)'yi genişletin.
Etiketler ve başlık'ı Yok olarak ayarlayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle'ye tıklayın. Gösterge'yi seçin.
Öğeyi genişlet. Etiket'i Gauge_Late olarak ayarlayın.
Boyut altında, aşağıdakileri ayarlayın:
- Genişlik (%): 48
- Yükseklik (%): 15
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 51
- Y ekseni (%): 11
Özellikleri düzenle'ye tıklayın.
Hesaplama olarak Sum(Sales) öğesini ekleyin.
Özellikler panelinde, Veri > Filtreler altında, Ekle'ye tıklayın.
Late Status öğesini seçin. Filtreyi genişletin.
Varsayılan Değerler filtre türünü koruyun ve Late onay kutusunu işaretleyin. Bu, görselleştirme verilerini yalnızca Late Status değeri Late olan kayıtları içerecek şekilde filtreler.
Görünüş > Genel öğesini genişletin.
Başlıkları göster'i Kapalı olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Aralık sınırları altında, Maks değerini aşağıdaki değere ayarlayın:
```
=Sum({1} Sales)
```
Grafik yapılandırmasını Radyal'dan Çubuk'a değiştirin.
Yön'ü Otomatik'ten Özel'e değiştirin ve Yatay'ın seçili olduğundan emin olun.
Kitaplığı kullan'ı kapatın ve Renk'i #87205d olarak ayarlayın.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Değer etiketi için rengi #ffffff olarak ayarlayın.
Stil panelinden çıkmak için 'e tıklayın.
Görünüş > Hesaplama ekseni: Sum(Sales)'ni genişletin.
Etiketler ve başlık değerini Yok olarak ayarlayın.
Düzen kapsayıcısına geri dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle öğesine tıklayın. KPI öğesini seçin.
Öğeyi genişlet. Etiket'i KPI_NotLate olarak ayarla.
Boyut altında, aşağıdakileri ayarla:
- Genişlik (%): 48
- Yükseklik (%): 9
Konum altında aşağıdakileri ayarlayın:
- X ekseni (%): 1
- Y ekseni (%): 27
Özellikleri düzenle'ye tıklayın.
Hesaplama olarak Sum(Sales) öğesini ekleyin.
Ölçüme ilişkin özelliklerde, Sayı biçimlendirme'yi Para Birimi olarak ayarlayın.
Biçim deseni öğesini şuna değiştirin:
```
$ #,##0.00;-$ #,##0.00
```
Özellikler panelinde, Veri > Filtreler altında, Ekle'ye tıklayın.
Late Status öğesini seçin. Filtreyi genişletin.
Varsayılan Değerler filtre türünü koruyun ve Not Late onay kutusunu işaretleyin. Bu, görselleştirme verilerini yalnızca Late Status değeri Not Late olan kayıtlarla filtreler.
Görünüş > Genel öğesini genişletin.
Başlıkları göster'i Kapalı olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 0 px olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: Maksimum değer
- İlk KPI başlığını göster seçeneğini kapatın
Stil panelinden çıkmak için öğesine tıklayın.
Görünüş > Renk öğesini genişletin.
Kitaplık renkleri geçişli düğmesini kapatın. Renk değerini #006580 yapın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle'ye tıklayın. KPI'ı seçin.
Öğeyi genişletin. Etiket'i KPI_Late olarak ayarlayın.
Boyut altında, aşağıdakileri ayarlayın:
- Genişlik (%): 48
- Yükseklik (%): 9
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 51
- Y ekseni (%): 27
Özellikleri düzenle'ye tıklayın.
Hesaplama olarak Sum(Sales) öğesini ekleyin.
Ölçüme ait özelliklerde, Sayı biçimlendirme'yi Para Birimi olarak ayarlayın.
Biçim desenini şuna değiştirin:
```
$ #,##0.00;-$ #,##0.00
```
Özellikler panelinde, Veri > Filtreler altında, Ekle'ye tıklayın.
Late Status öğesini seçin. Filtreyi genişletin.
Varsayılan Değerler filtre türünü koruyun ve Late onay kutusunu işaretleyin. Bu, görselleştirme verilerini yalnızca Late Status değeri Late içeren kayıtlara göre filtreler.
Görünüş > Genel öğesini genişletin.
Başlıkları göster öğesini Kapalı olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Tıklayın Stil.
Kenarlık altında, Dış Çizgi değerini 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: Maksimum değer
- İlk KPI başlığını göster seçeneğini kapatın.
Stil panelinden çıkmak için öğesine tıklayın.
Görünüş > Renk öğesini genişletin.
Kitaplık renkleri seçeneğini kapatın. Rengi #87205d olarak ayarlayın.
Paneldeki üst sütuna tıklayarak düzen kapsayıcısına geri dönün.

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle'ye tıklayın. Sütun grafiği seçin.
Öğeyi genişletin. Etiket'i BarChart_Simple olarak ayarlayın.
Gösterme koşulu için öğesine tıklayın.
Aşağıdakileri ekleyin:
```
=vViewChartValues=false()
```
Uygula'ya tıklayın.
Boyut altında aşağıdakileri ayarlayın:
- Genişlik (%): 81
- Yükseklik (%): 62
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 1
- Y ekseni (%): 37
Özellikleri düzenle'ye tıklayın.
Boyut olarak Product Type öğesini ekleyin.
Başka bir boyut ekle: Late Status.

Product Type şimdi Grup olarak ve Late Status Çubuklar olarak listelenmelidir.
Hesaplama olarak Sum(Sales) öğesini ekleyin.
Ölçüme ilişkin özelliklerde, Sayı biçimlendirme ayarını Para Birimi olarak belirleyin.
Biçim deseni öğesini şuna değiştirin:
```
$ #,##0.00;-$ #,##0.00
```
Görünüş > Genel öğesini genişletin.
Başlıkları göster'i Kapalı olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Gruplandırılmış sunumdan Yığılmış sunuma geçin.
Kılavuz çizgisi aralığı'nı Özel olarak ayarlayın. Açılır menüden Çizgi yok seçeneğini belirleyin.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Eksen etiketi yazı tipi boyutu: 16 piksel
Stil panelinden çıkmak için öğesine tıklayın.
Genişlet Görünüm > Renkler ve gösterge.
Renkler'i Özel > İfadeye göre olarak ayarlayın. Aşağıdaki ifadeyi kullanın:
```
=if([Late Status]='Not Late','#006580', if([Late Status]='Late','#87205d'))
```
Gösterge göster seçeneğini Kapalı olarak ayarlayın.
Genişlet Görünüm > X ekseni: Product Type, Late Status.
Etiketler ve başlık'ı Yalnızca etiketler olarak ayarlayın.
Görünüş > Y ekseni: Sum(Sales) öğesini genişletin.
Etiketler ve başlık'ta Yalnızca etiketler'i seçin.
Düzen kapsayıcısına geri dönmek için paneldeki üst sütuna tıklayın.

Aşağıdakileri yapın:

İçerik > Grafikler altında, BarChart_Simple öğesine sağ tıklayın ve Çoğalt'a tıklayın.
Öğeyi genişlet. Etiket'i BarChart_Detailed olarak ayarla.
Gösterim koşulu için 'e tıklayın.
Aşağıdakileri ekleyin:
```
=vViewChartValues=true()
```
Uygula'ya tıklayın.
Özellikleri düzenle'ye tıklayın.
Görünüm > Sunum bölümünü genişletin.
Değer etiketlerini açın.
Segment etiketlerini açın ve Toplam etiketlerinin açık olduğundan emin olun.
Stil'e tıklayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Eksen etiketi yazı tipi boyutu: 16 px
- Değer etiketleri yazı tipi boyutu: 14 px
öğesine tıklayarak stil panelinden çıkın.
Görünüm > Renkler ve gösterge öğesini genişletin.
Görünüm > X ekseni: Product Type, Late Status öğesini genişletin.
Etiketler ve başlık'ı Yalnızca etiketler olarak ayarlayın.
Görünüş > Y ekseni: Sum(Sales) öğesini genişletin.
Etiketler ve başlık'ı Yalnızca etiketler olarak ayarlayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Düzen kapsayıcısında bir bileşik anahtar düğmesi oluşturmak için kullanılacak üç ana görselleştirme oluşturun. Bu geçiş anahtarı, kullanıcıların sütun grafikteki değer etiketlerini açıp kapatmasına olanak tanır.

Öğe 1: Geçiş anahtarı tabanı

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle'ye tıklayın. Düğme'yi seçin.
Öğeyi genişletin. Etiket değerini ToggleSwitch_Base olarak ayarlayın.
Boyut altında, aşağıdakileri ayarlayın:
- Genişlik (%): 16
- Yükseklik (%): 7
Konum altında, aşağıdakileri ayarlayın:
- X ekseni (%): 83
- Y ekseni (%): 90
Özellikleri düzenle'ye tıklayın.
Eylemler ve navigasyon'u genişletin.
İşlem ekle'ye tıklayın.
Eylem için Değişken değerini ayarla seçeneğini belirleyin.
Değişken için vViewChartValues seçeneğini belirleyin.
Değer için öğesine tıklayın.

Aşağıdaki ifadeyi ekleyin:

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

Uygula'ya tıklayın.
Görünüş > Genel öğesini genişletin.
Show Values'i Etiket olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 2 piksel olarak ayarlayın.
Kenarlık rengini #000000 olarak ayarlayın.
Kenarlık için Köşe yarıçapını 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: 0.5
- Yazı tipi rengi > Renk: #000000
- Arka plan seçenekleri > Kullanılan renk: #ffffff
Stil panelinden çıkmak için öğesine tıklayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Öğe 2: AÇIK durumunu temsil eden düğme kısmı

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle öğesine tıklayın. Düğme Seçin.
Öğeyi genişletin. Etiket'i ToggleSwitch_ON olarak ayarlayın.
Koşulu göster için, öğesine tıklayın.
Aşağıdakileri ekleyin:
```
=vViewChartValues=true()
```
Uygula'ya tıklayın.
Boyut altında aşağıdakileri ayarlayın:
- Genişlik (%): 4
- Yükseklik (%): 7
Konum altında aşağıdakileri ayarlayın:
- X ekseni (%): 95}] ⏎
- Y ekseni (%): 90
Özellikleri düzenle'ye tıklayın.
Eylemler ve navigasyon'u genişletin.
İşlem ekle'ye tıklayın.
Eylem için Değişken değerini ayarla'yı seçin.
Değişken için vViewChartValues'yi seçin.
Değer için öğesine tıklayın.
Şu ifadeyi ekleyin:
```
=false()
```
Uygula'ya tıklayın.
Görünüş > Genel öğesini genişletin.
On öğesini Etiket olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 2 piksel olarak ayarlayın.
Kenarlık rengini #000000 olarak ayarlayın.
Kenarlık için Köşe yarıçapı'nı 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: 0.5
- Yazı tipi rengi > Renk: #ffffff
- Arka plan seçenekleri > Kullanılan renk: #109600
Stil panelinden çıkmak için öğesine tıklayın.
Paneldeki üst sütuna tıklayarak düzen kapsayıcısına geri dönün.

Öğe 3: KAPALI durumunu temsil eden düğme kısmı

Aşağıdakileri yapın:

İçerik > Grafikler altında, Ekle'ye tıklayın. Düğme'yi seçin.
Öğeyi genişletin. Etiket'i ToggleSwitch_ON olarak ayarlayın.
Gösterim koşulu için 'e tıklayın.
Aşağıdakileri ekleyin:
```
=vViewChartValues=false()
```
Uygula'ya tıklayın.
Boyut altında aşağıdakileri ayarlayın:
- Genişlik (%): 4
- Yükseklik (%): 7
Konum altında aşağıdakileri ayarlayın:
- X ekseni (%): 83
- Y ekseni (%): 90
Özellikleri düzenle'ye tıklayın.
Genişlet Eylemler ve navigasyon.
İşlem ekle'ye tıklayın.
Eylem için Değişken değerini ayarla seçin.
Değişken için vViewChartValues seçin.
Değer için tıklayın.
Şu ifadeyi ekleyin:
```
=true()
```
Uygula'ya tıklayın.
Görünüş > Genel öğesini genişletin.
Off öğesini Etiket olarak ayarlayın.
Görünüm > Sunum bölümünü genişletin.
Stil'e tıklayın.
Kenarlık altında, Dış Çizgi'yi 2 piksel olarak ayarlayın.
Kenarlık rengini #000000 olarak ayarlayın.
Kenarlık için Köşe yarıçapını 0 piksel olarak ayarlayın.
Grafik sekmesine geçiş yapın. Aşağıdaki özellikleri ayarlayın:
- Düzen davranışı: Uyumlu
- Yazı tipi boyutu: 0.5
- Yazı tipi rengi > Renk: #ffffff
- Arka plan seçenekleri > Kullanılan renk: #ff001e
Stil panelinden çıkmak için öğesine tıklayın.
Düzen kapsayıcısına dönmek için paneldeki üst sütuna tıklayın.

Bölüm 4: Sunumu sonlandırın

Başlık ve kenarlık ekleyerek düzen kapsayıcısını sonlandırın.

Aşağıdakileri yapın:

Özellikler panelinde Görünüm > Genel bölümünü genişletin.
Başlığı Geç vs. olarak ayarlayın. Geç Olmayan Siparişler - Satış Etkisi.
Görünüm > Sunum bölümünü genişletin.
Açın Grafikleri içeride tut.
Tıklayın Stil.
Kenarlık için aşağıdaki özellikleri ayarlayın:
- Anahat: 2 px
- Renk: #7b7a78
Gölge için aşağıdaki özellikleri ayarlayın:
- Orta boyut
- Renk: #7b7a78

Sonuçlar

Sayfa düzenleme modundan çıkın. Basit ve ayrıntılı sütun grafik arasında geçiş yapmak için geçiş düğmesine tıklayın.

Layout container with 'Show values' switched off, presenting the bar chart without value labels — Düzen kapsayıcısı, Değerleri göster kapalıyken

Layout container with 'Show values' switched on, presenting the bar chart with value labels — Layout container with Show values switched on

Click on the Not Late and Late titles at the top of the chart. Notice that clicking these elements selects the corresponding values in the app.

Düzen kapsayıcı, 'Geç Durum' alanında yapılan seçimle. — Alanında Late Status seçim Not Late içeren düzen kapsayıcı.

Bu sayfa size yardımcı oldu mu?

Bu sayfa veya içeriği ile ilgili bir sorun; bir yazım hatası, eksik bir adım veya teknik bir hata bulursanız lütfen bize bildirin!

Geri bildiriminizi buradan iletin