Tümünü genişlet/daralt

Resim arka plan katmanı ile eşleme oluşturma

Resimleri, harita görselleştirmelerinde özel temel harita olarak kullanabilirsiniz. Bir yerleşim planı üzerinde verileri görüntülemek isteyebilirsiniz.

Bu örnek harita grafiğinde, nokta katmanına sahip bir ofis yerleşim planı gösterilmiştir. Her bir kabarcık, bir çalışanın masasının üzerine konumlandırılır. Çalışan tarafından günlük olarak işlenen haftalık müşteri sorunları ortalaması, her bir kabarcığın boyutunu ve rengini belirler.

Bu örnek, varsayılan ölçeği gizler. Resimlerin tutarlı bir boyut ölçeği yoktur. Harita arka plan katmanındaki resim boyutu, kullanıcının resmin köşeleri için hangi koordinatları ayarladığına da bağlıdır.

Veri kümesi

Bu örnekte iki tablo ve bir arka plan resmi kullanılmaktadır. Web dosyası bağlayıcısını kullanarak iki tabloyu uygulamanıza içe aktarabilirsiniz.

CustomerIssues

CustomerIssues

Tarih	EmployeeNumber	CustomerIssues
8/1/2019	1	24
8/1/2019	2	31
8/1/2019	3	21
8/1/2019	4	42
8/1/2019	5	24
8/1/2019	6	40
8/1/2019	7	40
8/1/2019	8	19
8/1/2019	9	23
8/1/2019	10	47
8/1/2019	11	38
8/1/2019	12	21
8/1/2019	13	22
8/1/2019	14	15
8/1/2019	15	30
8/1/2019	16	46
8/1/2019	17	41
8/1/2019	18	31
8/1/2019	19	50
8/1/2019	20	27
8/1/2019	21	35
8/1/2019	22	38
8/1/2019	23	37
8/1/2019	24	31
8/1/2019	25	13
8/1/2019	26	11
8/2/2019	1	35
8/2/2019	2	31
8/2/2019	3	33
8/2/2019	4	14
8/2/2019	5	24
8/2/2019	6	33
8/2/2019	7	40
8/2/2019	8	14
8/2/2019	9	44
8/2/2019	10	24
8/2/2019	11	37
8/2/2019	12	39
8/2/2019	13	49
8/2/2019	14	16
8/2/2019	15	42
8/2/2019	16	13
8/2/2019	17	45
8/2/2019	18	48
8/2/2019	19	46
8/2/2019	20	18
8/2/2019	21	18
8/2/2019	22	45
8/2/2019	23	47
8/2/2019	24	31
8/2/2019	25	10
8/2/2019	26	21
8/3/2019	1	16
8/3/2019	2	34
8/3/2019	3	15
8/3/2019	4	44
8/3/2019	5	49
8/3/2019	6	18
8/3/2019	7	16
8/3/2019	8	41
8/3/2019	9	27
8/3/2019	10	46
8/3/2019	11	21
8/3/2019	12	49
8/3/2019	13	38
8/3/2019	14	30
8/3/2019	15	48
8/3/2019	16	17
8/3/2019	17	42
8/3/2019	18	48
8/3/2019	19	44
8/3/2019	20	44
8/3/2019	21	12
8/3/2019	22	44
8/3/2019	23	17
8/3/2019	24	24
8/3/2019	25	25
8/3/2019	26	33
8/4/2019	1	20
8/4/2019	2	45
8/4/2019	3	32
8/4/2019	4	37
8/4/2019	5	32
8/4/2019	6	50
8/4/2019	7	41
8/4/2019	8	14
8/4/2019	9	37
8/4/2019	10	39
8/4/2019	11	28
8/4/2019	12	35
8/4/2019	13	24
8/4/2019	14	19
8/4/2019	15	25
8/4/2019	16	26
8/4/2019	17	23
8/4/2019	18	45
8/4/2019	19	48
8/4/2019	20	36
8/4/2019	21	40
8/4/2019	22	21
8/4/2019	23	10
8/4/2019	24	42
8/4/2019	25	35
8/4/2019	26	26
8/5/2019	1	24
8/5/2019	2	28
8/5/2019	3	44
8/5/2019	4	19
8/5/2019	5	34
8/5/2019	6	37
8/5/2019	7	14
8/5/2019	8	26
8/5/2019	9	38
8/5/2019	10	25
8/5/2019	11	41
8/5/2019	12	35
8/5/2019	13	48
8/5/2019	14	36
8/5/2019	15	36
8/5/2019	16	37
8/5/2019	17	31
8/5/2019	18	44
8/5/2019	19	21
8/5/2019	20	28
8/5/2019	21	13
8/5/2019	22	10
8/5/2019	23	50
8/5/2019	24	35
8/5/2019	25	11
8/5/2019	26	39
8/6/2019	1	26
8/6/2019	2	14
8/6/2019	3	45
8/6/2019	4	27
8/6/2019	5	33
8/6/2019	6	21
8/6/2019	7	14
8/6/2019	8	45
8/6/2019	9	41
8/6/2019	10	35
8/6/2019	11	35
8/6/2019	12	13
8/6/2019	13	35
8/6/2019	14	26
8/6/2019	15	40
8/6/2019	16	14
8/6/2019	17	20
8/6/2019	18	23
8/6/2019	19	11
8/6/2019	20	23
8/6/2019	21	31
8/6/2019	22	48
8/6/2019	23	39
8/6/2019	24	50
8/6/2019	25	47
8/6/2019	26	40
8/7/2019	1	49
8/7/2019	2	39
8/7/2019	3	16
8/7/2019	4	28
8/7/2019	5	46
8/7/2019	6	37
8/7/2019	7	36
8/7/2019	8	15
8/7/2019	9	18
8/7/2019	10	25
8/7/2019	11	12
8/7/2019	12	37
8/7/2019	13	40
8/7/2019	14	35
8/7/2019	15	11
8/7/2019	16	12
8/7/2019	17	22
8/7/2019	18	16
8/7/2019	19	46
8/7/2019	20	39
8/7/2019	21	41
8/7/2019	22	26
8/7/2019	23	25
8/7/2019	24	34
8/7/2019	25	50
8/7/2019	26	41

EmployeeData

EmployeeData

Çalışan	EmployeeNumber	Enlem	Boylam
Nehru Pollard	1	2.1	-2.1
Duncan Bell	2	1.675	-2.1
Arthur Miller	3	2.1	-1.6
Latifah Randall	4	1.675	-1.6
Glenna Giles	5	2.1	-1.1
Chaim Gates	6	1.675	-1.1
Elijah Mcgowan	7	2.1	-0.585
Serina Richards	8	1.675	-0.585
Nora Odonnell	9	2.1	0.595
Fiona Craig	10	1.675	0.595
Kirestin Mcguire	11	2.1	1.155
Francesca Wilkerson	12	1.675	1.155
Virginia Sanford	13	2.1	1.6
Beau Weeks	14	1.675	1.6
Justin Cook	15	2.1	2.2
Lisandra Sloan	16	1.675	2.2
Brody Ball	17	2.1	2.6
Kirk Welch	18	1.675	2.6
Julian Mcgee	19	0.7	3.25
Geoffrey Wheeler	20	0.7	3.7
Carter Leonard	21	0.14	3.25
Noel Watson	22	0.14	3.7
Damian Everett	23	-0.3	3.25
Justina Frazier	24	-0.3	3.7
MacKenzie Garcia	25	-0.85	3.25
Germane Carey	26	-0.85	3.7

Arka plan resmi

Oluşturma şeklim

Aşağıdakileri yapın:

1. Veri kaynaklarını uygulamanıza ekleyin ve her bir tablodaki EmployeeNumber alanlarını kullanarak tabloları ilişkilendirin.
2. Bir sayfaya harita grafiği ekleyin.

3. Harita ayarları bölümünde aşağıdakileri yapın:

   • Temel harita'yı Yok olarak değiştirin.
   • Projeksiyon'u Kullanıcı tanımlı (derece) olarak değiştirin.

4. Görünüş > Sunum bölümünde aşağıdakileri yapın:

   • Ölçek çubuğu'nu Kapalı durumuna getirin.
   • Yakınlaştırma düzeylerini sınırla öğesini Özel olarak ayarlayın ve yakınlaştırmayı 7x yakınlaştırma - 8x yakınlaştırma değerine getirin.

5. Harita grafiğine bir arka plan katmanı ekleyin ve Veri bölümünde aşağıdakileri yapın:

   • Biçim bölümünde Resim öğesini seçin.
   • URL'sini https://help.qlik.com/en-US/sense/Subsystems/Hub/Content/Resources/Images/ui_map-image-background-example.png olarak ayarlayın.
   • Sol üst köşe'yi Üst (enlem) için 2.5 olarak ve Sol (boylam) için -4.1 olarak ayarlayın.
   • Sağ alt köşe'yi Alt (enlem) için -2.5 olarak ve Sağ (boylam) için 4.1 olarak ayarlayın.
   Bilgi notu

   Örneğimizin bu noktasında, görüntü henüz görünmüyor. Bir sonraki adımda bir nokta katmanı ekledikten sonra harita doğru ölçek ve görüntü konumuyla güncellenir.

6. Harita grafiğine bir nokta katmanı ekleyin ve aşağıdakileri yapın:

   • Veri bölümünde alan olarak Employee alanını ekleyin.
   • Konum bölümünde Enlem ve boylam alanları öğesini seçin. Enlem alanı olarak Enlem, Boylam alanı olarak Boylam değerini ayarlayın.
   • Boyut ve Şekil bölümünde Boyutlandırma türüAvg(CustomerIssues) seçeneğini ayarlayın.

   • Renkler bölümünde aşağıdakileri yapın:

     • Renkler'i Özel olarak ayarlayın ve Hesaplamaya göre renklendirin.
     • Hesaplama olarak Avg(CustomerIssues) seçeneğini belirleyin.
     • Renk düzeni olarak Uzaklaşan sınıflar seçeneğini belirleyin.

Sayfanın üst kısmındaki görüntüyle aynı görünüm ve hissi elde etmek için uygulama temasını Sense Classic olarak ayarlayın.