HTML5 Coğrafi Konumlandırma
- Önceki Sayfa HTML5 Taşıma
- Sonraki Sayfa HTML5 Taşıma
HTML5 Coğrafi Konum (Coğrafi Konum) kullanıcı konumunu belirlemek için kullanılır.
Kullanıcı konumunu belirleme
HTML5 Coğrafi Konum API'si kullanıcı konumunu elde etmek için kullanılır.
Bu özellik kullanıcı gizliliğini ihlal edebilir, bu yüzden kullanıcı izni olmadan kullanıcı konum bilgisi kullanılamaz.
Tarayıcı desteği
Internet Explorer 9, Firefox, Chrome, Safari ve Opera coğrafi konumu destekler.
Açıklama:GPS'ye sahip cihazlar, örneğin iPhone, coğrafi konum daha doğru olur.
HTML5 - Coğrafi Konum Kullanımı
Kullanıcı konumunu almak için getCurrentPosition() yöntemini kullanın.
Aşağıdaki örnek, kullanıcı konumunun enlem ve boylamını 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 edin
- Destekliyse, getCurrentPosition() yöntemini çalıştırın. Desteklenmiyorsa, kullanıcıya bir mesaj gösterin.
- 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 reddi işlemek
getCurrentPosition() yönteminin ikinci parametresi hataları işlemek için kullanılır. Bu fonksiyon, kullanıcı konumunu alamadığında çalışacak bir fonksiyonu tanımlar:
Örnek
function showError(error) { switch(error.code) { case error.PERMISSION_DENIED: x.innerHTML="Kullanıcı Konum Talebini reddetti." break; case error.POSITION_UNAVAILABLE: x.innerHTML="Konum bilgisi mevcut değil." break; case error.TIMEOUT: x.innerHTML="Kullanıcı konumunu almak için yapılan talep 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 konumlandırma izni vermedi
- 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 ve boylam kullanılabilen bir harita hizmetine erişmeniz gerekecek, ö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 ve boylam verilerini kullanarak Google Haritalar'da konumu gösteriyoruz (istikrarlı görsel kullanılarak).
Yukarıdaki bağlantı, işaret, ölçek 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ükseklik hassasiyeti |
coords.heading | Yön, kuzeyden başlayarak derecelerle |
coords.speed | Hız, metrekare/şeytani saniye olarak |
timestamp | Cevabın 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 Taşıma
- Sonraki Sayfa HTML5 Taşıma