Skip to content

HTML Geolocation API

Geolocation API foydalanuvchining joriy joylashuvini aniqlash uchun ishlatiladi.


Foydalanuvchi joylashuvini aniqlash

Geolocation API yordamida foydalanuvchining joriy joylashuvini olish mumkin.

Bu maxfiylikka ta'sir qilishi mumkinligi sababli, joylashuv faqat foydalanuvchi ruxsat berganidan keyin olinadi.

Eslatma

Geolocation API faqat HTTPS kabi xavfsiz kontekstlarda ishlaydi.

TIP

Geolocation API eng aniq natijani GPS mavjud qurilmalarda, masalan, smartfon yoki aqlli soatlarda beradi.

js
const x = document.getElementById("demo");

// Joylashuvni olish funksiyasi
function joylashuvniOlish() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(joylashuvniKorsatish, xatolikniKorsatish);
  } else {
    x.innerHTML = "Brauzerda Geolocation qo'llab-quvvatlanmaydi.";
  }
}

// Joylashuvni ko'rsatish funksiyasi
function joylashuvniKorsatish(malumot) {
  x.innerHTML = "Kenglik: " + malumot.coords.latitude +
    "<br>Uzunlik: " + malumot.coords.longitude;
}

// Xatolikni ko'rsatish funksiyasi
function xatolikniKorsatish(xato) {
  switch(xato.code) {
    case xato.PERMISSION_DENIED:
      x.innerHTML = "Foydalanuvchi Geolocation so'rovini rad etdi.";
      break;
    case xato.POSITION_UNAVAILABLE:
      x.innerHTML = "Joylashuv ma'lumotlari mavjud emas.";
      break;
    case xato.TIMEOUT:
      x.innerHTML = "Joylashuvni olish so'rovi vaqt tugadi.";
      break;
    case xato.UNKNOWN_ERROR:
      x.innerHTML = "Noma'lum xatolik yuz berdi.";
      break;
  }
}

Brauzerlar qo'llab-quvvatlashi

Quyidagi jadvalda Geolocation API ni to'liq qo'llab-quvvatlash boshlanadigan brauzer versiyalari ko'rsatilgan.

APIChromeEdge/IEFirefoxSafariOpera
Geolocation5.012.03.55.010.6

HTML Geolocation API dan foydalanish

Geolocation API ga navigator.geolocation orqali murojaat qilinadi. Bu foydalanuvchidan joylashuv ma'lumotlarini olish uchun ruxsat so'raladi. Agar foydalanuvchi ruxsat bersa, brauzer qurilmadagi eng yaxshi imkoniyatdan (masalan, GPS) foydalanadi.

getCurrentPosition() metodi foydalanuvchining joriy joylashuvini qaytaradi.

Quyidagi misolda foydalanuvchining kengligi va uzunligi olinadi:

js
const x = document.getElementById("demo");

// Joylashuvni olish funksiyasi
function joylashuvniOlish() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(muvaffaqiyat, xato);
  } else {
    x.innerHTML = "Brauzerda Geolocation qo'llab-quvvatlanmaydi.";
  }
}

// Muvaffaqiyatli natijani ko'rsatish funksiyasi
function muvaffaqiyat(malumot) {
  x.innerHTML = "Kenglik: " + malumot.coords.latitude +
    "<br>Uzunlik: " + malumot.coords.longitude;
}

// Xatolikni ko'rsatish funksiyasi
function xato() {
  alert("Kechirasiz, joylashuv ma'lumotlari mavjud emas.");
}

Misol izohi:

  • Geolocation qo'llab-quvvatlanishini tekshirish
  • Agar Geolocation mavjud bo'lsa, getCurrentPosition() metodini ishga tushirish. Aks holda, foydalanuvchiga xabar chiqarish
  • muvaffaqiyat() funksiyasi foydalanuvchining joylashuvini kenglik va uzunlikda chiqaradi
  • xato() funksiyasi agar xatolik yuz bersa, matnli ogohlantirish chiqaradi

Xatoliklarni qayta ishlash va rad etishlar

getCurrentPosition() metodining ikkinchi parametri xatoliklarni qayta ishlash uchun ishlatiladi. Bu xatolik yuz berganda bajariladigan funksiyani belgilaydi.

Quyida xatoliklarni aniqroq qayta ishlash misoli keltirilgan:

js
function xato(xato) {
  switch(xato.code) {
    case xato.PERMISSION_DENIED:
      x.innerHTML = "Foydalanuvchi Geolocation so'rovini rad etdi.";
      break;
    case xato.POSITION_UNAVAILABLE:
      x.innerHTML = "Joylashuv ma'lumotlari mavjud emas.";
      break;
    case xato.TIMEOUT:
      x.innerHTML = "Joylashuvni olish so'rovi vaqt tugadi.";
      break;
    case xato.UNKNOWN_ERROR:
      x.innerHTML = "Noma'lum xatolik yuz berdi.";
      break;
  }
}

Joylashuvga oid ma'lumotlar

Geolocation quyidagi joylashuvga oid ma'lumotlar uchun juda foydali:

  • Mahalliy yangilangan ma'lumotlar
  • Foydalanuvchi yaqinidagi diqqatga sazovor joylarni ko'rsatish
  • GPS orqali yo'nalish bo'yicha harakat (navigator)

getCurrentPosition() metodi - Qaytariladigan ma'lumotlar

getCurrentPosition() metodi muvaffaqiyatli natijada obyekt qaytaradi. Kenglik, uzunlik va aniqlik har doim qaytariladi. Boshqa xususiyatlar mavjud bo'lsa, qaytariladi:

XususiyatQaytariladigan qiymat
coords.latitudeKenglik (doim qaytariladi)
coords.longitudeUzunlik (doim qaytariladi)
coords.accuracyJoylashuv aniqligi (doim qaytariladi)
coords.altitudeDengiz sathidan balandlik (agar mavjud bo'lsa)
coords.altitudeAccuracyBalandlik aniqligi (agar mavjud bo'lsa)
coords.headingShimoldan soat strelkasi bo'yicha burchak (agar mavjud bo'lsa)
coords.speedTezlik (m/s, agar mavjud bo'lsa)
timestampJavob vaqti (agar mavjud bo'lsa)

Geolocation obyektining boshqa qiziqarli metodlari

Geolocation obyektida quyidagi qiziqarli metodlar mavjud:

  • watchPosition() – Foydalanuvchining joriy joylashuvini qaytaradi va harakatlanishda yangilab boradi (masalan, avtomobil GPS).
  • clearWatch()watchPosition() metodini to'xtatadi.

Quyidagi misolda watchPosition() metodi ishlatilgan. Buni sinash uchun aniq GPS qurilmasi kerak (masalan, smartfon):

js
const x = document.getElementById("demo");

// Joylashuvni olish funksiyasi
function joylashuvniOlish() {
  if (navigator.geolocation) {
    navigator.geolocation.watchPosition(muvaffaqiyat, xato);
  } else {
    x.innerHTML = "Brauzerda Geolocation qo'llab-quvvatlanmaydi.";
  }
}

// Muvaffaqiyatli natijani ko'rsatish funksiyasi
function muvaffaqiyat(malumot) {
  x.innerHTML = "Kenglik: " + malumot.coords.latitude +
    "<br>Uzunlik: " + malumot.coords.longitude;
}

// Xatolikni ko'rsatish funksiyasi
function xato(xato) {
  switch(xato.code) {
    case xato.PERMISSION_DENIED:
      x.innerHTML = "Foydalanuvchi Geolocation so'rovini rad etdi.";
      break;
    case xato.POSITION_UNAVAILABLE:
      x.innerHTML = "Joylashuv ma'lumotlari mavjud emas.";
      break;
    case xato.TIMEOUT:
      x.innerHTML = "Joylashuvni olish so'rovi vaqt tugadi.";
      break;
    case xato.UNKNOWN_ERROR:
      x.innerHTML = "Noma'lum xatolik yuz berdi.";
      break;
  }
}