Maps

Kuika'nın Maps elementi, uygulamanızda coğrafi verileri görsel olarak temsil etmenizi sağlar. Kullanıcıların belirli konumları, bölgeleri veya yolları etkileşimli bir harita üzerinde görüntülemesine olanak tanır. Maps elementi, özellikle konum tabanlı verilerin sunulması gereken uygulamalarda, etkinliklerin, mağazaların veya hizmetlerin yerlerini belirtmek için kullanılır. Bu eğitim içeriğinde, Maps elementini nasıl ekleyeceğinizi, haritanızı nasıl yapılandıracağınızı ve kullanıcı etkileşimini nasıl artıracağınızı öğreneceksiniz.

Maps elementi, web ve mobil uygulamaları desteklemektedir.

Bu eğitim içeriği aşağıdaki başlıklardan oluşmaktadır:

Maps elementi ekleme,
Maps elementi özellikleri,
Authorization (Yetkilendirme),
Visibility (Görünürlük),
Editability (Düzenlenebilirlik),
Style Panel ile arayüz tasarımını özelleştirme,
Actions (Aksiyonlar).

Properties panelinde bulunan:

Datasources: Harita üzerinde gösterilecek lokasyonların veri kaynağını seçmenizi sağlar. Datasources modülünü açın ve kullanmak istediğiniz veri kaynağını seçin. Desteklenen veri kaynakları arasında REST API, Swagger, SQL Actions, AI Actions, MSSQL DB, Oracle, C#, Bluetooth bulunur. Seçtiğiniz veri kaynağına bir isim verin ve gerekli ayarları yaparak oluşturun.some text
- Eğer REST API kullanıyorsanız, Service Base URL’yi girin ve harita üzerinde pinlerin görüntülenebilmesi için API Endpoint kısmına /pins ve getPins gibi ifadeleri ekleyin. GET yöntemi, API hizmetinde veri listelemek ve görüntülemek için kullanılır. Diğer veri kaynakları için, o kaynağın gerektirdiği bağlantı ayarlarını yaparak devam edin.
- Backend/API veya seçilen veri kaynağına uygun aksiyonlar eklenmelidir. Properties panelinde Add Actions ile açılan listeden, seçilen veri kaynağına uygun aksiyonu seçin (örneğin, Custom → Google Maps → Get Pins From Google Maps aksiyonu).
Aksiyon ayarlaması: Aksiyonları ekledikten sonra Properties → Datasources kısmında, kullanılan veri kaynağına göre son ayarlamaları yapın.
Show Circle Center: Belirlenen Radius değerinin merkezini göstermeye yarar. Radius belirtilmediyse bu özellik kullanılamaz.
Auto Center: Haritada sabit olarak göstermek istediğiniz konumu belirlemenizi sağlar. Haritada nereye giderseniz gidin, haritada ne kadar yakınlaştırma ya da uzaklaştırma işlemleri yaparsanız yapın Auto Center’e tıklandığında açılacak konumu bu parametre ile ayarlayabilirsiniz.
Latitude: Harita açılışındaki merkezi enlem değerinin verildiği alandır. Statik olabileceği gibi Symbol Picker ile bir elementin değeri ve aksiyonun sonucu gibi dinamik değerler de alabilir.
Longitude: Harita açılışındaki merkezi boylam değerinin girildiği alandır. Statik olabileceği gibi Symbol Picker ile elementin değeri ve aksiyonun sonucu gibi dinamik değerlerde alabilir. Latitude (enlem) ve longitude (boylam) girerek kullanıcı haritanın ilk açılışta hangi koordinatı merkez alarak açacağını belirtir.

Latitude ve Longitude değerleri “Decimal” formatında olmalıdır.

Maps elementi, latitude ve longitude değerleri Null (boş) olduğunda bile harita ekranını açar ve diğer konumları görüntüler.

Google Maps'te Lantitude (Enlem) Longitude (Boylam) Değerlerini Alma

Öncelikle tarayıcınızdan Google Maps’e girin. Haritadan istediğiniz yeri veya alanı seçip sağ tıklayın. Açılan pencerede en üstte latitude (enlem) ve longitude (boylam) değerlerini ondalık biçimde bulabilirsiniz. Koordinatları otomatik olarak kopyalamak için latitude (enlem) ve longitude (boylam) değerlerine sol tıklayın. Değerler kopyalanacaktır.

URL’den alınan latitude (enlem) ve longitude (boylam) değerlerinin kullanılması pek önerilmemektedir çünkü bu değerler hatalı olabilir.

Circle Radius In Km: Haritada verilen çap boyutunda bir çember oluşturulur. Verisi görüntülenecek alanı dairesel çap değerinin girildiği bölümdür. Kilometre ölçü birimi ile arama alanının çapını belirtebilirsiniz.
Group Picker Icon: Geliştirdiğiniz uygulama içerisinde zoom yapıldığında ikonların teker teker görüntülendiği, zoom out yapıldığında ise gruplanarak tek bir pin ikonuna dönüştüğü ikonu özelleştirebilirsiniz.
Group Picker Color: Harita üzerinde aynı grupta bulunan işaretçilerin rengini belirler. Group Picker Color özelliği sayesinde, aynı gruptaki işaretçileri kolayca ayırt edebilirsiniz.
Current Location Icon: Harita üzerindeki mevcut konumu özel bir simge ile göstermenize olanak tanır.
Current Location Color: Harita üzerindeki mevcut konumun rengini özelleştirmenize olanak tanır.
Keep Center On Zoom: Kullanıcı, Map içinde scroll yaptıkça merkez değiştirir. Bu merkezi otomatik olarak seçilmiş gibi yapıp tekrar event çağrılması sağlanır.
Marker Pop-up On Width: Harita genişliği belirli bir boyuta ulaştığında marker pop-up’ın etkin olup olmayacağını kontrol etmenizi sağlar (Örneğin, harita genişliği 600 pikselden fazlaysa pop-up’lar görünür.)
Selected Location Icon: Haritada seçtiğiniz konumun simgesini belirlemenizi sağlar. Seçilen konumu görsel olarak vurgulamak için özel bir simge kullanabilirsiniz.
Selected Location Color: Haritada seçtiğiniz konumun rengini Selected Location Color özelliği ile belirleyebilirsiniz.