Maps

Web ve Mobil uygulamalarda haritanın gösterilmesi ve kullanılmasını sağlayabilirsiniz. Geliştirdiğiniz Web ve Android uygulamalarda Google Maps, iOS uygulamalarda ise Apple Map üzerinde gösterim yapılır. Maps elementini uygulamanıza ekledikten sonra Google Maps API bağlantısını Configuration Manager aracılığıyla ayarlamalısınız.

Maps elementinin özelliklerini görüntülemek için çalışma alanına eklediğiniz Maps elementini seçin.

Sağ kenarda Properties panel ile;

Datasource
Show Circle Center
AutoCenter
Latitude
Longitude
Marker Detail Width
Circle Radius In Km
Group Picker Icon
Group Picker Color
Selected Location Icon
Current Location Icon
Keep Center On Zoom
Authorization
Visibility
Actions

Başlıklarından ihtiyacınız olan düzenlemeleri yapabilirsiniz.

Haritayı çalışma alanına yerleştirdikten sonra Maps elementine Datasource oluşturmak gerekmektedir.

Datasources: Harita içinde gösterilecek lokasyonların veri tablosunu seçmenizi sağlar.

Datasources modülünü açın. Sol panel üst kenarında bulunan Add butonu (+) Rest API’yi seçin ve bir isim vererek oluşturun. Ardından kullanmak istediğiniz Service Base URL’sini girin. Son olarak API Hizmetinin nasıl sonlandırılmasını istiyorsanız o şekilde değerler girin. Harita üzerinde pinlerin görüntülenebilmesi için API Endpoint kısmına /pins ve getPins şeklinde ifadeleri girin.

Get, API Hizmetinde veri listelemek ve görüntülemek için kullanılır.

Veri kaynağı bağlantısı yapıldıktan sonra Backend/API için actions eklenmelidir. Properties panelinde Add Actions ile açılan listeden Custom > GoogleMaps > GetPinsFromGoogleMaps özel aksiyonunu seçin.

Aksiyon ayarlaması: Aksiyonları ekledikten sonra Properties (özellikler) > Datasources’da son bir ayarlama ile aşağıdaki gibi ufak bir ayarlama yapılmalı.

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 (Enlem): 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 (Boylam): 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.

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.

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.

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.