Giriş
Google Melez Uygulama Düzenleyici (GME), mashup geliştiricileri için uzun süredir beklenen ve işe yarayan araçlardan biridir. GME, geliştiricilerin harici verilerle bağlantıları temel alarak haritalar, tablolar, listeler ve diğer öğeler gibi web sayfalarında dinamik bileşenler oluşturup düzenlemelerine yardımcı olur. Bu öğeler daha sonra iframe kullanılarak web sayfalarına ve blog'lara eklenebilir.Bu eğiticide, bir KML dosyasını GME ile oluşturulan bir haritaya nasıl dahil edebileceğiniz anlatılmaktadır.
Google Mashup Editor'daki ilk gösterimlerim
- Google ürünlerinin çoğu gibi temiz ve özel bir arayüze sahip olan bu çözüm, son derece basittir.
- Sürekli artan bir kod örneği koleksiyonunun yanı sıra yazarın kodunun bulunduğu uygun bir proje dizinine sahiptir.
- Proje için ek kaynakların (resim dosyaları gibi) kolayca depolanmasını sağlar.
- Kolayca kullanılabilen bir XML hata ayıklayıcısına sahiptir.
- Kullanımı kolay birçok örnek uygulama içerir.
KML Geliştiricileri için GME
İnternetin ortaya çıkmasından önce, mekansal verilerin paylaşılması geleneksel olarak zordu. Bununla birlikte, internetin gelişmesiyle harita uygulamaları, Coğrafi Bilgi Sistemleri (GIS) verilerini dünyayla kolayca paylaşmanın standart bir yolu haline geldi. KML, kompakt, geliştirmesi kolay ve Google Earth ve Google Haritalar gibi popüler uygulamalar tarafından desteklendiği için GIS verilerinin sunulması ve değiştirilmesi için bir standart haline gelmektedir.
Yakın zamana kadar, JavaScript'i temel alan sayfa oluşturma ve düzenleme işlemi KML geliştiricileri için büyük bir sorundu. Mashup oluşturmak ve hata ayıklamak için çok sayıda ek adım gerekiyordu. GME, birkaç temel bileşenden çok hızlı bir şekilde KML tabanlı mashup oluşturmayı mümkün kılar. Oluşturma işlemi için HTML veya JavaScript konusunda özel bilgi sahibi olmanız gerekmez. GME örnek projeleri, başlamak için yeterli sayıda kaynak sağlar.
Aşağıdaki örnekte, Pict Earth ABD'de çekilen fotoğrafların koleksiyonuna işaret eden bir KML dosyası kullanacağım.
Bu, Pict Earth harita karışımının anlık görüntüsüdür:
Google Haritalar API'sini kullanarak bir KML dosyasını bir GME projesine entegre etmek için aşağıdaki adımları uygulayın:
1. Adım: KML dosyasını seçin
2. Adım: Yeni bir GME projesi oluşturun
3. Adım: KML'yi eklemek için bir işlev oluşturun
4. Adım: Bir harita ekleyin
5. Adım: Mashup'ı test edin
6. Adım: Mashup 1Görseli düzenle 1{1
1. Adım: KML dosyasını seçin
Haritanıza eklemek istediğiniz KML dosyasını seçin. Bu, Google Haritalar'da desteklenen özelliklere sahip herhangi bir şey olabilir. Herkesin kullanımına açık bir sunucuda barındırılmalıdır.
2. Adım: Yeni bir GME Projesi oluşturun
Yeni, boş bir GME projesi oluşturun.
Boş bir GME projesi aşağıdaki gibi görünür:
İşleviniz için bir başlık ve ad ekleyin.
<gm:page title="Pict Earth görevleri" Authentication="false" onload="KMLPE()"></gm:page>
3. Adım: KML'yi eklemek için bir işlev oluşturun
Haritaya eklenecek KML dosyasının yolunu içeren bir JavaScript işlevi oluşturun.
<script>
function kmlPE()
{
<!-- Get map -->
var myMap = google.mashups.getObjectById('map').getMap();
<!-- Get KML -->
var geoXml = new GGeoXml("http://pictearthusa.com/kml/missions.kml");
<!--Place KML on Map -->
myMap.addOverlay(geoXml);
<!--Set zoom on double click -->
myMap.enableDoubleClickZoom();
}
</script>
4. Adım: Harita ekleyin
Harita ve parametreler ekleyin.
<gm:map id="map" height="400px" width="400px" lat="32.9393" lng="-117.206" zoom="9" maptypes="true"/>
5. Adım: Karıştırmayı test edin.
Test düğmesine (F4) basın.
Bu, Korumalı Alan'da test edilen Pict Earth mashup'ının resmidir.
Artık uygulama metnini doğrulayabiliyor ve ilk sonucu görebiliyoruz. Başlık ve bağlantılar ekleyip tekrar test edebiliriz.
6. Adım: Mashup'ı yayınlayın
Projenin adını belirleyip yayınlayın. Bu seçenek, mashup'ınızın web sayfalarına eklemek için kullanabileceği kalıcı bir bağlantı sunar. Örneğimde, GME projesinin ana sayfasına bağlantı veriyorum. Ayrıca projenin kaynak kodunu da görebilirsiniz.
7. Adım: Mashup'ı bir web sayfasına ekleyin
Bir iframe kullanarak mashup'ı bir web sayfasına ekleyin. Örneğin, örnek projeyi eklemek için şunu ekleyin:
<iframe style="WIDTH: 439px; HEIGHT: 491px" src="http://pemissions.googlemashups.com/" frameborder="0"></iframe>
Web sayfasında ve blogda mashup örnekleri vardır.
Projeye Google Analytics kodunuzu da ekleyerek, sayfanızı kimlerin görüntülediğiyle ilgili istatistikleri izleyebilirsiniz. Ekleyeceğiniz basit komut dosyasını aşağıda görebilirsiniz:
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">uacct = "youraccountnumber";urchinTracker();</script>
8. Adım: Cihazı GME Galerisi'ne ekleyin
Mashup'ınızı GME Mashup Gallery'de yayınlayın. Bu işlem, diğer kullanıcıların mashup'ınızı görüntüleyebilmesini sağlar.
Daha fazla bilgi için:
Melez oluşturma işlemini ayrıntılı olarak sunan Google Melez Uygulama Düzenleyici Başlangıç Kılavuzu'na göz atın. Ayrıca, örnekleri içeren tüm gm etiketlerinin kısa bir açıklaması için etiket listesine göz atın.
Kod:
Pict Earth KML'yi GME'de kullanmaya yönelik kodun tamamını aşağıda bulabilirsiniz:
<gm:page title="Pict Earth missions" authenticate="false" onload="kmlPE()>
<!-- Map definition -->
<gm:mapid="map" height="400px" width="400px" lat="32.9393" lng="-117.206" zoom="9" maptypes="true"/>
<script>
function kmlPE(){
<!-- Get map -->
var myMap = google.mashups.getObjectById('map').getMap();
<!-- Get KML -->
var geoXml = new GGeoXml("http://pictearthusa.com/kml/missions.kml");
<!-- Place KML on Map -->
myMap.addOverlay(geoXml);
<!-- Set zoom on double click -->
myMap.enableDoubleClickZoom();
}
</script>
</gm:page>
Sonraki adım
Mashup'ınızı yayınladıktan sonra KML dosyasını başka bir uygulamaya dahil etmek için bir parametre olarak kullanabilir veya doğrudan harita olarak yükleyebilirsiniz. Örneğin, bu sayfa:
http://param.googlemashups.com bir GME mashup'ı. URL'ye bir parametre olarak KML= ekleyerek bir KML dosyasını doğrudan mashup'a referans verebilirsiniz. Örneğin: http://param.googlemashups.com/?KML=http://mapwares.googlepages.com/cta.KMLProjenizden Gadget da oluşturabilirsiniz. Gönderdikten sonra dosya menüsüne gidip Gadget Gönder'i tıklayın ve talimatları uygulayın. Bu sayede uygulamanızı Google kişiselleştirilmiş ana sayfanıza diğer web sayfalarından kolayca ekleyebilir ve başkalarıyla paylaşabilirsiniz.