HTML Eğitimi

HTML ANA SAYFA HTML'ye Giriş HTML Düzenleyiciler HTML Temel HTML Öğeleri HTML Özellikleri HTML Başlıkları HTML Paragrafları HTML Stilleri HTML Biçimlendirme HTML Alıntılar HTML Yorumları HTML Renkleri HTML CSS'si HTML Bağlantıları HTML Görselleri HTML Sık Kullanılan Simgesi HTML Tabloları HTML Listeleri HTML Bloğu ve Satır İçi HTML Sınıfları HTML Kimliği HTML İç Çerçeveleri HTML JavaScript'i HTML Dosya Yolları HTML Başlığı HTML Düzeni HTML Duyarlı HTML Bilgisayar Kodu HTML Semantiği HTML Stil Kılavuzu HTML Varlıkları HTML Sembolleri HTML Emojileri HTML Karakter Seti HTML URL Kodlaması HTML'ye karşı XHTML

HTML Formları

HTML Formları HTML Formu Nitelikleri HTML Form Öğeleri HTML Giriş Türleri HTML Girdi Nitelikleri HTML Giriş Formu Nitelikleri

HTML Grafikleri

HTML Kanvas HTML SVG'si

HTML Ortamı

HTML Ortamı HTML Videosu HTML Ses HTML Eklentileri HTML YouTube

HTML API'leri

HTML Coğrafi Konum HTML Sürükle/Bırak HTML Web Depolama HTML Web Çalışanları HTML ÖAM

HTML Örnekleri

HTML Örnekleri HTML Testi HTML Alıştırmaları HTML Sertifikası HTML Özeti HTML Erişilebilirliği

HTML Referansları

HTML Etiket Listesi HTML Özellikleri HTML Genel Nitelikleri HTML Tarayıcı Desteği HTML Olayları HTML Renkleri HTML Kanvas HTML Ses/Video HTML Doktipleri HTML Karakter Kümeleri HTML URL Kodlaması HTML Dil Kodları HTTP Mesajları HTTP Yöntemleri PX'den EM'ye Dönüştürücü Klavye kısayolları

HTML Coğrafi Konum API'si


HTML Geolocation API, bir kullanıcının konumunu bulmak için kullanılır.


Kullanıcının Konumunu Bulun

HTML Geolocation API, bir kullanıcının coğrafi konumunu almak için kullanılır.

Bu, gizliliği tehlikeye atabileceğinden, kullanıcı onaylamadıkça pozisyon kullanılamaz.

Not: Konum belirleme, akıllı telefonlar gibi GPS'li cihazlar için en doğrudur.


Tarayıcı Desteği

Tablodaki sayılar, Geolocation'ı tam olarak destekleyen ilk tarayıcı sürümünü belirtir.

API
Geolocation 5.0 - 49.0 (http)
50.0 (https)
9.0 3.5 5.0 16.0

Not: Chrome 50'den itibaren, Coğrafi Konum API'si yalnızca HTTPS gibi güvenli bağlamlarda çalışır. Siteniz güvenli olmayan bir kaynakta (HTTP gibi) barındırılıyorsa, kullanıcıların konumunu alma istekleri artık çalışmayacaktır.


HTML Coğrafi Konumunu Kullanma

Yöntem getCurrentPosition(), kullanıcının konumunu döndürmek için kullanılır.

Aşağıdaki örnek, kullanıcının konumunun enlem ve boylamını döndürür:

Örnek

<script>
var x = document.getElementById("demo");
function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}

function showPosition(position) {
  x.innerHTML = "Latitude: " + position.coords.latitude +
  "<br>Longitude: " + position.coords.longitude;
}
</script>

Örnek açıkladı:

  • Coğrafi Konum'un desteklenip desteklenmediğini kontrol edin
  • Destekleniyorsa, getCurrentPosition() yöntemini çalıştırın. Değilse, kullanıcıya bir mesaj görüntüleyin
  • getCurrentPosition() yöntemi başarılı olursa, parametrede (showPosition) belirtilen işleve bir koordinat nesnesi döndürür
  • showPosition() işlevi Enlem ve Boylamı verir

Yukarıdaki örnek, hata işleme içermeyen çok basit bir Geolocation komut dosyasıdır.



Hataları ve Redleri İşleme

Yöntemin ikinci parametresi getCurrentPosition()hataları işlemek için kullanılır. Kullanıcının konumunu alamazsa çalıştırılacak bir işlevi belirtir:

Örnek

function showError(error) {
  switch(error.code) {
    case error.PERMISSION_DENIED:
      x.innerHTML = "User denied the request for Geolocation."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML = "Location information is unavailable."
      break;
    case error.TIMEOUT:
      x.innerHTML = "The request to get user location timed out."
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML = "An unknown error occurred."
      break;
  }
}

Lokasyona Özgü Bilgiler

Bu sayfa, bir kullanıcının konumunun bir harita üzerinde nasıl gösterileceğini göstermiştir.

Coğrafi konum, aşağıdakiler gibi konuma özgü bilgiler için de çok kullanışlıdır:

  • Güncel yerel bilgiler
  • Kullanıcının yakınındaki ilgi çekici noktaları gösterme
  • Adım adım navigasyon (GPS)

getCurrentPosition() Yöntemi - Verileri Döndür

Yöntem getCurrentPosition(), başarı durumunda bir nesne döndürür. Enlem, boylam ve doğruluk özellikleri her zaman döndürülür. Varsa diğer özellikler döndürülür:

Property Returns
coords.latitude The latitude as a decimal number (always returned)
coords.longitude The longitude as a decimal number (always returned)
coords.accuracy The accuracy of position (always returned)
coords.altitude The altitude in meters above the mean sea level (returned if available)
coords.altitudeAccuracy The altitude accuracy of position (returned if available)
coords.heading The heading as degrees clockwise from North (returned if available)
coords.speed The speed in meters per second (returned if available)
timestamp The date/time of the response (returned if available)

Coğrafi Konum Nesnesi - Diğer ilginç Yöntemler

Geolocation nesnesinin başka ilginç yöntemleri de vardır:

  • watchPosition()- Kullanıcının mevcut konumunu döndürür ve kullanıcı hareket ettikçe (arabadaki GPS gibi) güncellenen konumu döndürmeye devam eder.
  • clearWatch()watchPosition()- Yöntemi durdurur .

Aşağıdaki örnek watchPosition()yöntemi göstermektedir. Bunu test etmek için doğru bir GPS cihazına ihtiyacınız var (akıllı telefon gibi):

Örnek

<script>
var x = document.getElementById("demo");
function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.watchPosition(showPosition);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}
function showPosition(position) {
  x.innerHTML = "Latitude: " + position.coords.latitude +
  "<br>Longitude: " + position.coords.longitude;
}
</script>