HTML5 Coğrafi Konum
- Önceki Sayfa HTML5 Geçiş
- Sonraki Sayfa HTML5 Taşıma
HTML5 Coğrafi Konum (geografi konum) kullanıcı konumunu belirlemek için kullanılır.
Kişisel olarak deneyin: Google Haritalar üzerinde konumunuzu gösterin
Kullanıcı konumunu belirlemek
HTML5 Coğrafi Konum API'si kullanıcı konumunu almak için kullanılır.
Bu özellik kullanıcı gizliliğini ihlal edebilir, bu yüzden kullanıcı onayı olmadan kullanıcı konum bilgisi kullanılamaz.
Tarayıcı desteği
Internet Explorer 9, Firefox, Chrome, Safari ve Opera coğrafi konumu destekler.
Not:GPS içeren cihazlar, örneğin iPhone için coğrafi konum daha doğru olacaktır.
HTML5 - Coğrafi Konum Kullanımı
Kullanıcı konumunu almak için getCurrentPosition() yöntemini kullanın.
Aşağıdaki örnek, kullanıcı konumunu döndürebilen basit bir coğrafi konum örneğidir.
Örnek
<script> var x=document.getElementById("demo"); function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else{x.innerHTML="Bu tarayıcı tarafından coğrafi konum desteklenmiyor.";} } function showPosition(position) { x.innerHTML="Enlem: " + position.coords.latitude + "<br />Boylam: " + position.coords.longitude; } </script>
Örnek açıklaması:
- Coğrafi konumun desteklenip desteklenmediğini kontrol etmek
- Destekleniyorsa, getCurrentPosition() yöntemini çalıştır. Desteklenmiyorsa, kullanıcıya bir mesaj gösterilir.
- getCurrentPosition() çalıştığında, showPosition parametresinde belirtilen fonksiyona bir koordinat nesnesi döner
- showPosition() fonksiyonu enlem ve boylamı alır ve gösterir
Yukarıdaki örnek, hata işleme içermeyen çok temel bir coğrafi konum betiğidir.
Hataları ve reddetmeleri işlemek
getCurrentPosition() yönteminin ikinci parametresi hataları işlemek için kullanılır. Kullanıcı konumunu alamadığında çalışacak fonksiyonu belirler:
Örnek
function showError(error) { switch(error.code) { case hata.PERMISSION_DENIED: x.innerHTML="Kullanıcı Konum talebini reddetti." break; case hata.POSITION_UNAVAILABLE: x.innerHTML="Konum bilgisi mevcut değil." break; case error.TIMEOUT: x.innerHTML="Kullanıcı konumunu almak için yapılan istem zaman aşımına uğradı." break; case error.UNKNOWN_ERROR: x.innerHTML="Bilinmeyen bir hata meydana geldi." break; } }
Hata kodu:
- İzin reddedildi - Kullanıcı coğrafi konum belirleme izni verilmedi
- Konum mevcut değil - Konum alınamıyor
- Timeout - İşlem zaman aşımı
Haritada sonuçları gösterme
Haritada sonuçları göstermek için, enlem-boylam kullanabilen bir harita hizmetine erişmeniz gereklidir, örneğin Google Haritalar veya Baidu Haritalar:
Örnek
function showPosition(position) { var latlon=position.coords.latitude+","+position.coords.longitude; var img_url="http://maps.googleapis.com/maps/api/staticmap?center=" +latlon+"&zoom=14&size=400x300&sensor=false"; document.getElementById("mapholder").innerHTML="<img src='"+img_url+"' />"; }
Örnekte, dönen enlem-boylam verilerini kullanarak Google Haritalar'da konumu gösteriyoruz (statik görsel kullanılarak).
Yukarıdaki bağlantı, işaret, ölçekleme ve sürükle-bırak seçenekleri ile işaretli, ölçeklenebilir ve sürükle-bırak özellikli etkileşimli haritaları nasıl gösterdiğinizi gösterir.
Belirli bir konumun bilgileri
Bu sayfada, haritada kullanıcı konumunu nasıl gösterdiğinizi gösteriyoruz. Ancak, coğrafi konum belirli bir konumun bilgileri için de çok faydalıdır.
Örnek:
- Yerel bilgileri günceller
- Kullanıcının etrafındaki ilgi noktalarını gösterir
- İnteraktif araç içi navigasyon sistemi (GPS)
getCurrentPosition() metodu - Dönen veri
Başarı durumunda, getCurrentPosition() metodu nesne döndürür. Her zaman latitude, longitude ve accuracy özellikleri döndürülür. Kullanılabilirse, aşağıdaki özellikler de döndürülür.
Özellik | Açıklama |
---|---|
coords.latitude | Ondalık sayısal enlem |
coords.longitude | Ondalık sayısal boylam |
coords.accuracy | Konum doğruluğu |
coords.altitude | Deniz seviyesinden yükseklik, metrekare cinsinden ölçülür |
coords.altitudeAccuracy | Konumun deniz seviyesine olan yüksekliği |
coords.heading | Yön, kuzeyden başlayarak derece cinsinden |
coords.speed | Hız, her saniye için metre cinsinden |
timestamp | Cevaplayan tarih/zaman |
Coğrafi Konum Objesi - Diğer İlgili Yöntemler
watchPosition() - Kullanıcının mevcut konumunu döndürür ve kullanıcı hareket ederken güncellenen konumları döndürür (arabada bulunan GPS gibi).
clearWatch() - watchPosition() yöntemini durdurur
Aşağıdaki örnek watchPosition() yöntemini gösterir. Bu örneği test etmek için doğru bir GPS cihazına (örneğin iPhone) ihtiyacınız olacaktır:
Örnek
<script> var x=document.getElementById("demo"); function getLocation() { if (navigator.geolocation) { navigator.geolocation.watchPosition(showPosition); } else{x.innerHTML="Bu tarayıcı tarafından coğrafi konum desteklenmiyor.";} } function showPosition(position) { x.innerHTML="Enlem: " + position.coords.latitude + "<br />Boylam: " + position.coords.longitude; } </script>
- Önceki Sayfa HTML5 Geçiş
- Sonraki Sayfa HTML5 Taşıma