Bulut Altyapı

.NET MAUI 11’de Harita Pin Kümeleme: Pratik Rehber

Açık konuşayım: harita üstüne 200 tane pin koyup “kullanıcı halleder” dediğim günleri hatırladıkça hâlâ biraz utanıyorum. 2018’di galiba, bir lojistik firmasının şube haritasını yapıyorduk; ekran açılır açılmaz İstanbul’un üstü kırmızı pinlerden görünmez oluyordu, müşteri bakıyor, biz bakıyoruz, kimse kimseye bakamıyor. O zamanlar clustering işini elle yazıyorduk — grid hesabı, yakın pinleri grupla, zoom değişince yeniden hesapla… Tam bir çileydi.

Neyse, uzatmayayım..NET MAUI 11 Preview üç ile Map kontrolüne pin clustering özelliği geldi. Hem Android hem iOS/Mac Catalyst tarafında çalışıyor. Üstelik tek bir property açıyorsunuz, gerisi platform tarafında kendi işini görüyor. Yıllardır GitHub’da #11811 numaralı issue’da beklenen şey buydu. Nihayet geldi.

Evet, doğru duydunuz.

Pin Clustering Tam Olarak Nedir?

Şunu fark ettim: Kafada canlandırması kolay aslında. Google Maps’te “yakınımdaki restoranlar” diye arattığınızda ekranda 300 tane pin çıkmıyor ya, işte olay o. Onun yerine “42” yazan bir balon görüyorsunuz; zoom yaptıkça o balon parçalanıyor, küçük balonlara ayrılıyor, iyice yaklaştığınızda da tek tek pinler ortaya çıkıyor. Basit gibi duruyor.

İşte clustering tam olarak bu. Birbirine yakın pinleri otomatik olarak tek bir “küme marker”ına çeviriyor. Üstündeki rozet kaç tane pin olduğunu gösteriyor, zoom in yaptıkça kümeler açılıyor, zoom out yaptıkça birleşiyor. Kağıt üstünde kolay görünüyor ama işin içine girince algoritma tarafı bayağı uğraştırıyor; neyse ki artık bunu düşünmek zorunda değiliz.

Bir dakika — bununla bitmedi. GitHub Status Sayfası Yenilendi: Şeffaflık Dönemi Başladı yazımızda bu konuya da değinmiştik.

Neden Önemli? Sadece “Güzel Görünsün” Meselesi Değil

Performans kısmını atlamayın derim. Haritaya 500 pin attığınızda — bir düşüneyim… özellikle eski Android cihazlarda — FPS düşüyor, gesture’lar takılıyor, bazen uygulama kilitleniyor; yani mesele sadece estetik değil (yanlış duymadınız). Clustering aynı zamanda render yükünü ciddi biçimde azaltan bir optimizasyon oluyor. Bir e-ticaret müşterimizde “mağaza bulucu” ekranında clustering’e geçtiğimizde eski Samsung A serisi cihazlarda açılış süresi 4,2 saniyeden 1,1 saniyeye düşmüştü. Aynen böyle, ciddiyim.

Nasıl Açılır? Tek Property, Bitti

Bence, En sevdiğim kısım burası. XAML tarafında tek satır:

<maps:Map IsClusteringEnabled="True" />

Bakın, Tamam.

Bi saniye — Bitti yani. Haritaya eklediğiniz pinler birbirine yakınsa otomatik gruplanıyor, üstlerinde sayaç görünüyor. Hiçbir paket yüklemenize gerek yok, custom renderer yazmanıza da gerek yok. Tahmin eder misiniz? Ben ilk denediğimde “yahu bu kadar kolay olamaz, bir yerde tuzak vardır” diye düşündüm ama yok; gerçekten bu kadar.

“Kaç yıldır beklediğim bir özelliğin sonunda framework’ün kendisine gelmesi — bu tür küçük detaylar aslında MAUI’nin olgunlaştığını gösteriyor. Xamarin Forms döneminde bunu elle yazmak için günlerce uğraşmıştık.”

Farklı Kategorileri Ayrı Kümelerde Toplamak

Şimdi gerçek hayatta işler biraz karışıyor tabii. Düşünün ki bir turist uygulaması yapıyorsunuz; haritada hem kafeler var hem parklar hem oteller hem de müzeler. Bunlar aynı lokasyonda olsa bile ayrı ayrı kümelensin istiyorsunuz çünkü kullanıcı bazen “burada 3 işletme var” bilgisinden çok “burada 3 kafe var” bilgisini önemsiyor (ben de ilk duyduğumda şaşırmıştım)

İşte burada ClusteringIdentifier devreye giriyor. Her pin’e bir grup kimliği atıyorsunuz ve aynı kimliğe sahip olanlar birlikte kümeleniyor:

map.Pins.Add(new Pin
{
Label = "Kahve Dünyası Karaköy",
Location = new Location(41.0256, 28.9744),
ClusteringIdentifier = "coffee"
});
map.Pins.Add(new Pin
{
Label = "Gülhane Parkı",
Location = new Location(41.0128, 28.9813),
ClusteringIdentifier = "parks"
});
map.Pins.Add(new Pin
{
Label = "Pera Müzesi",
Location = new Location(41.0316, 28.9745),
ClusteringIdentifier = "museums"
});

Pinler aynı sokakta bile olsa — ki İstanbul’da böyle yer çok — kendi gruplarında kümeleniyorlar. Identifier boş bırakılırsa hepsi default gruba düşüyor. Bu arada dikkat: identifier string olduğu için tip güvenliği yok; ben bunu enum’a çevirip extension method ile yönetmeyi tercih ediyorum, daha temiz oluyor.

Kurumsal Müşterilerde Gördüğüm Senaryo

Logosoft’ta bir sigorta şirketi için anlaşmalı sağlık kuruluşları haritası yapmıştık. O projede ClusteringIdentifier olmadığı için manuel renderer yazmak zorunda kalmıştık; hastane, eczane, laboratuvar ve diş kliniği olmak üzere dört ayrı kategori vardı. Eğer o zaman bu özellik olsaydı sanırım üç gün kadar işten tasarruf ederdik. Şimdi yeni projede rahatız.

Küme Tıklamalarını Yönetmek

Default davranış şu: kullanıcı kümeye tıklayınca harita o kümenin ortasına zoom yapıyor ve pinleri açıyor. Çoğu senaryoda bu yeterli oluyor ama bazen araya girmek isteyebilirsiniz; mesela bir liste göstermek, bottom sheet açmak ya da özel bir detay ekranı sunmak gibi (evet, doğru duydunuz)

ClusterClicked event’i tam bunun için:

map.ClusterClicked += async (sender, e) =>
{
var isimler = string.Join("
", e.Pins.Select(p => p.Label));
await DisplayAlert(
$"Bu bölgede {e.Pins.Count} mekan var",
isimler,
"Kapat");
// Varsayılan zoom davranışını iptal etmek istiyorsanız:
e.Handled = true;
};

Bakın, Event args içinde üç önemli şey var: (buna dikkat edin)

  • Pins — kümedeki tüm pin’lerin listesi; LINQ ile istediğinizi yapabilirsiniz
  • Location — kümenin coğrafi merkezi; harita dışı bir işlem yapacaksanız işe yarıyor — ciddi fark yaratıyor
  • Handled — true yaparsanız default zoom iptal oluyor; kontrol sizde kalıyor

Ha bu arada, Handled = true yapıp hiçbir şey göstermezseniz kullanıcı tıkladığında hiçbir şey olmuyor. Bu bayağı tuhaf bir UX olur, dikkat edin derim. Ben genelde bottom sheet açıyorum; kullanıcı oradan seçim yapıyor. Daha fazla bilgi için Azure MCP Visual Studio 2022’de: Eklenti Devri Bitti yazımıza bakabilirsiniz.

Platform Tarafında Neler Dönüyor?

Bu kısmı biraz merak edip dokümana daldım açıkçası. İki platformda farklı yaklaşım var ve bu da mantıklı:

Platform Clustering Yaklaşımı Bağımlılık
Android Custom grid-based algoritma kullanılıyor, zoom değişince yeniden hesaplıyor Yok, harici kütüphane gerekmiyor
Ios / Mac Catalyst Kendi native MKClusterAnnotation desteği kullanılıyor (MapKit) Platform SDK yeterli oluyor
windows Daha desteklenmiyor (Preview 3 itibarıyla)

Ios tarafında animasyonlar daha akıcı hissediliyor çünkü direkt Apple’ın native desteğini kullanıyor. Android’de de kötü değil ama biraz daha mekanik geliyor bana; kümeler açılıp kapanırken Apple’daki gibi smooth geçiş olmuyor, daha çok “pop” şeklinde ilerliyor. Umarım GA’ya kadar bu kısım biraz daha cilalanır (evet, doğru duydunuz)

💡 Bilgi: Windows desteği şu an yoktur diyelim de yanlış anlaşılmasın ama eksik taraf orası işte budur… Eğer ana hedefiniz Windows masaüstü uygulamasıysa clustering için beklemeniz ya da alternatif bir map kontrolü kullanmanız gerekiyor.

Türkiye’deki Ekipler Açısından Değerlendirme

Ne yalan söyleyeyim, Neyse şimdi işin yerel tarafına gelelim çünkü asıl tablo orada biraz netleşiyor bence. Türkiye’de gördüğüm kadarıyla MAUI benimsenmesi hâlâ ağır ilerliyor; çoğu ekip ya Flutter’a kaydı ya da React Native’de kaldı. Xamarin’den MAUI’ye geçmeyen epey takım var ve bunun sebeplerinden biri de “henüz olgunlaşmadı” algısıydı. Bu konuyla ilgili Azure Smart Tier GA: Blob Depolamada Otomatik Tasarruf yazımıza da göz atmanızı tavsiye ederim.

Bir dakika — bununla bitmedi.

Açık konuşayım, Bence bu tarz özellikler tam da o algıyı kıran şeyler oluyor:

  • Banka şube/ATM bulucular: Türkiye’de her bankanın binlerce şube/ATM’si var; clustering olmadan İstanbul haritası açılır açılmaz kilitlenebiliyor.
  • Kargo takip haritaları: Aras, Yurtiçi ve MNG gibi firmaların şube haritaları için bayağı uygun duruyor.
  • Belediye uygulamaları: Parklar, müzeler ve otoparklar — hepsi farklı CclusteringIdentifier? Hayır pardon… CclusteringIdentifier?; yok yok doğru olan CClusteringIdentifier?. Neyse uzatmayayım — hepsi ayrı gruplarla yönetilebiliyor demek istiyorum.
  • Emlak uygulamaları:> Kiralık/satılık ilanları fiyat aralıklarına göre kümelenmiş şekilde göstermek mümkün oluyor.
  • Emlak uygulamaları:
    EOF

    Sıkça Sorulan Sorular

    Pin clustering hangi.NET MAUI sürümünden itibaren kullanılabiliyor?

    .NET MAUI 11 Preview 3 ile geldi. Daha önceki sürümlerde bu özellik yoktu; hani clustering için ya community kütüphaneleri kullanılıyordu ya da custom renderer yazılıyordu. Bence GA (kararlı) sürüm için.NET 11 final çıkışını beklemek en güvenlisi.

    Aynı anda farklı kategorilerdeki pin’leri ayrı gruplarda toplayabilir miyim?

    Evet, yapabiliyorsun. Her Pin nesnesinin ClusteringIdentifier property’si var. Aynı identifier’a sahip pin’ler kendi aralarında kümeleniyor, farklı identifier’dakiler birbirinden bağımsız kümeler oluşturuyor. Coğrafi olarak yakın olsalar bile — bu önemli bir detay — birbirine karışmıyorlar.

    Clustering Windows’ta çalışıyor mu?

    Bence, Şu an (Preview 3 itibarıyla) sadece Android ve iOS/Mac Catalyst destekleniyor. Yani Windows tarafında clustering yok. Açıkçası Windows desteği gelene kadar Windows hedefli projelerde alternatif bir yol bulmanız gerekiyor.

    Kümenin görselini (ikon, renk) özelleştirebilir miyim?

    Doğrusu, Preview 3 itibarıyla temel özelleştirme biraz sınırlı kalıyor. Platform bazında native API’lere erişmek gerekebilir. GA sürümünde daha zengin özelleştirme seçenekleri gelmesi bekleniyor; bence sabırla beklenmeye değer (ki bu çoğu kişinin gözünden kaçıyor). Şimdilik varsayılan görünüm aslında yeterince nötr, çoğu uygulamaya uyum sağlıyor.

    Çok sayıda pin performansı nasıl etkiliyor?

    Clustering zaten performansı iyileştirmek için var. iOS’ta native MKClusterAnnotation kullanıldığı için — tecrübeme göre — 1000+ pin’e kadar sorun çıkmıyor. Android’de custom grid algoritması var, o da 500-800 pin’e kadar akıcı çalışıyor. Bunun üstüne çıkacaksanız mesela server-side clustering stratejisi düşünmenizi öneririm.

    Kaynaklar ve İleri Okuma

    Vallahi, Pin Clustering in.NET MAUI Maps — Orijinal Duyuru (David Ortinau)

    .NET MAUI Map Kontrolü Resmi Dokümantasyonu

    .NET MAUI Samples Reposu — Clustering Örnek Sayfası

    GitHub Issue #11811 — Pin Clustering Request Tartışması

Aşkın KILIÇ

20+ yıl deneyimli Azure Solutions Architect. Microsoft sertifikalı bulut mimari ve DevOps danışmanı. Azure, yapay zekâ ve bulut teknolojileri üzerine Türkçe teknik içerikler üretiyor.

AZ-305AZ-104AZ-500AZ-400DP-203AI-102

Bu içerik işinize yaradı mı?

Benzer içerikleri kaçırmamak için beni sosyal medyada takip edin.

← Onceki Yazi
GitHub Status Sayfası Yenilendi: Şeffaflık Dönemi Başladı

Yorum Yaz

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

İçindekiler
← GitHub Status Sayfası Yenilend...