22 Mayıs 2008 Perşembe

Google Map Api - Ders 6 - Hareket eden işaretçiler oluşturmak

Belki de bu apinin en çok beğendim özelliği hareket eden işaretçiler oluşturmak. Aslında burada apinin ekstradan herhangi bir özelliğini kullanmayacağız. Sadece programlama mantığımızdan yola çıkarak temel bir kaç javascript özelliği ile hareket edebilen işaretçiler oluşturacağız.

Programımızı yine fonksiyonlara ayiriyoruz. En başta işaretçimizi oluşturduk bunda problem yok.
Şimdi 4 tane metodumuz olacak.

1-) startMarker() : Isaretciyi hareket icin tetikleyecek metod
2-) stopMarker() : Isaretcinin hareketini durduracak metod
3-) moveMarker() : Isaretciyi hareket ettirecek metod
4-) setCoords() : Isaretcinin hareket edecegi koordinatları random olarak oluşturacak metod. Ben random koordinatlar olusturdum, arzu eden buraya elle degerler girip isaretcinin bir yol üzerinde hareket etmesini sağlayabilir. Projemde ben bu sekilde kullanmıstım. Elle degerleri girip aracları belli yol üzerinde hareket ettirebiliyordum.

Javascript'te timer olaylarını biraz bilmek gerekiyor. startMarker metodunda yer alacak aşağıdaki kod , speedInterval milisaniye sonra moveMarker metodunun çalıştıracağını belirtiyor.


function startMarker()
{
timerID = setTimeout("moveMarker()", speedInterval);
}


Peki movemarket metodunda ne yapiliyor? Random olarak urettigimiz koordinatlara işaretçinin yönlendirilmesi yapiliyyor:


function moveMarker()
{
coordObj = new GLatLng(coordY[coordSayac],coordX[coordSayac]);
busMarker.setLatLng(coordObj);
coordSayac++;
timerID = setTimeout("moveMarker()", speedInterval);
}


Fonksyionun ilk satirinda random degerler ile doldurdugumuz coordY ve coordX arraylarindan ilgili indexteki degerler ile bir koordinat objesi oluşturuluyor ( coordObj ). Daha sonra işaretçi buraya yönlendiriliyor ( busMarker.setLatLng ). Daha sonra index değeri bir arttırılıp, aynı metod speedInterval milisaniye sonra tekrar çağırılıyor.

Örneğin tamamı için:

http://afsungur.googlepages.com/map_ornek_8.html

Hiç yorum yok:

Yorum Gönder