Google Maps API sayesinde sitenize bedava Google Haritasını eklemenizi sağlayan javascript kütüphanesidir. Bu sayede mesela okul sitesi yaptınız okulun yerini google map ile gösterebilirsiniz
Başlangıç:
Google amcanın bu hizmetinde yararlanmak için bir Google Map anahtarı (key)oluşturmanız gerekiyor. Sign Up for the Google Maps API – Google Maps API – Google Code adresinden web sitenizin adresini girip belitilen koşulları girmeniz gerekli. Burası önemli çünkü o anahtar sadece sizin sitenizde çalışacaktır. Başka bir sitede çalışmaz ama anahtarı sitenizdeki tüm dizinlerde kullanabilirsiniz. aşağıdaki kodları az biraz değiştirerek kendinize uyarlayabilirsiniz.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=utf-8″/>
<title>Google Maps JavaScript API Example</title>
<script src=”http://maps.google.com/maps?file=api&v=2&
key=ABQIAAAAEdmdbN3_LLmNarikN3TrshRJEhM5G8kmHTLX-nVEQd2nxILXrxReVjVzjTtpCiXzXwQM78vLxzqdWQ”
type=”text/javascript”></script>
<script type=”text/javascript”>
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
}
//]]>
</script>
</head>
<body onload=”load()” onunload=”GUnload()”>
<div id=”map” style=”width: 500px; height: 300px”></div>
</body>
</html>
key i değiştirip sizin siteniz için aldığınız key i koymanız lazım
diğer koyu ile işaretlediğim yer olan koordinatları ise Get Lat Lon – find the latitude and longitude of a point on a map adresinden bulabilirsiniz. koordinatların yanındaki 13 sayısı ise büyütme oranıdır. yine aynı sitede Google Maps zoom level: şeklinde yer alıyor.
ayrıca Şunlar ile de extra özellikler katabilirsiniz.Bu fonksiyonları map.setCenter dan sonraki satıra koyarsanız çalışacaktır.
Kontrol Ekleme://küçük yön tuşları ve büyütme küçüktme kontrolü
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
Bilgi Baloncuğu Ekleme//haritanın merkezinde bir baloncuk oluşturur. yazısı ise merhaba dünya oluyor
map.openInfoWindow(map.getCenter(),
document.createTextNode(“Merhaba Dünya”));
İşaretleyici Ekleme://bununla da toplu iğne gibi duran bir şekil varya işte onu merkez olarak kabul ettiğiniz yere ekliyebiliyorsunuz.
var marker = new GMarker(map.getCenter(), {draggable: false});
map.addOverlay(marker);
yeterince açıklayıcı olduğunu düşünüyorum ama yine de takıldığınız bir yer olursa sorabilirsiniz.
Leave a Reply
Yorum yazabilmeniz için giriş yapmanız gerekmektedir.