ایچ تی ایم ایل5 جیوگرافیائی پوزیشن

HTML5 جغرافیایی‌سازی (جغرافیایی‌سازی) برای مشخص کردن موقعیت کاربر استفاده می‌شود.

به طور شخصی امتحان کنید: موقعیت خود را در نقشه گوگل نمایش دهید

موقعیت کاربر را مشخص کنید

API جغرافیایی HTML5 برای دریافت موقعیت جغرافیایی کاربر استفاده می‌شود.

به دلیل اینکه این ویژگی ممکن است حریم خصوصی کاربر را نقض کند، اطلاعات موقعیت کاربر قابل دسترسی نیست مگر اینکه کاربر موافقت کند.

پشتیبانی مرورگر

Internet Explorer 9، Firefox، Chrome، Safari و Opera از جغرافیایی‌سازی پشتیبانی می‌کنند.

نکته:برای دستگاه‌هایی که دارای GPS هستند، مانند iPhone، جغرافیایی‌سازی دقیق‌تر است.

HTML5 - استفاده از جغرافیایی‌سازی

برای دریافت موقعیت کاربر از روش getCurrentPosition() استفاده کنید.

در اینجا یک مثال ساده از جغرافیایی‌سازی است که می‌تواند طول و عرض جغرافیایی موقعیت کاربر را بازمی‌گرداند.

مثال

<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition);
    }
  else{x.innerHTML="این مرورگر پشتیبانی از موقعیت جغرافیایی نمی‌کند.";}
  }
function showPosition(position)
  {
  x.innerHTML="纬度: " + position.coords.latitude +
  "<br /> طول عرض جغرافیایی: " + position.coords.longitude;
  }
</script>

به طور شخصی امتحان کنید

توضیح مثال:

  • تشخیص این که آیا پشتیبانی از جغرافیایی‌سازی وجود دارد یا خیر
  • اگر پشتیبانی شود، روش getCurrentPosition() اجرا می‌شود. اگر پشتیبانی نشود، پیامی به کاربر نمایش داده می‌شود.
  • اگر getCurrentPosition() با موفقیت اجرا شود، یک مقیاس‌ها (coordinates) به تابعی که توسط پارامتر showPosition مشخص شده است، بازمی‌گرداند
  • تابع showPosition() طول و عرض جغرافیایی را دریافت و نمایش می‌دهد

مثال بالا یک اسکریپت جغرافیایی بسیار پایه‌ای است که شامل اشکال‌زدایی نیست.

اشکال‌زدایی و رد درخواست

getCurrentPosition() کا دوسرا پارامتر برای اشکال‌زدایی استفاده می‌شود. آن معین می‌کند که در صورت شکست در دریافت موقعیت کاربر، چه تابعی باید اجرا شود:

مثال

function showError(error)
  {
  switch(error.code)
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="استفاده‌کننده درخواست موقعیت جغرافیایی را رد کرده است."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="موقعیت اطلاعات دسترسی ندارست."
      break;
    case error.TIMEOUT:
      x.innerHTML="درخواست برای دریافت مکان کاربر به تعویق افتاده است."
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML="یک خطای ناشناخته رخ داده است."
      break;
    }
  }

به طور شخصی امتحان کنید

کد خطا:

  • ممنوعیت مجوز - کاربر مجوز مکان‌یابی را ندارد
  • مکان قابل دسترسی نیست - نمی‌توان مکان فعلی را دریافت کرد
  • Timeout - عملیات به تعویق افتاده

نمایش نتایج در نقشه

برای نمایش نتایج در نقشه، باید به سرویس نقشه‌ای که از مختصات طول و عرض جغرافیایی استفاده می‌کند، دسترسی داشته باشید، مانند نقشه گوگل یا نقشه بای‌دو:

مثال

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+"' />";
}

به طور شخصی امتحان کنید

در مثال بالا، ما از داده‌های مختصات طول و عرض جغرافیایی بازگشتی در نقشه گوگل برای نمایش مکان (با استفاده از تصویر ثابت) استفاده کردیم.

اسکریپت گوگل‌مپ

لینک بالا به شما نشان می‌دهد که چگونه می‌توانید از اسکریپت برای نمایش نقشه تعاملی با گزینه‌های تیک، زوم و حرکت دستی استفاده کنید.

اطلاعات مکان‌دهی

این صفحه نمایش‌دهنده نحوه نمایش مکان کاربر روی نقشه است. اما، تعیین مکان جغرافیایی برای اطلاعات مکان‌دهی نیز بسیار مفید است.

مثال:

  • به‌روزرسانی اطلاعات محلی
  • نمایش نقطه‌های جذاب اطراف کاربر
  • سیستم هدایت خودرو تعاملی (GPS)

روش getCurrentPosition() - داده‌های بازگشتی

اگر موفق باشد، روش getCurrentPosition() یک شیء را برمی‌گرداند. همیشه ویژگی‌های latitude، longitude و accuracy را برمی‌گرداند. اگر قابل دسترسی باشد، ویژگی‌های زیر را نیز برمی‌گرداند.

ویژگی‌ها توضیحات
coords.latitude مختصات عرض جغرافیایی به صورت عدد اعشاری
coords.longitude مختصات طول جغرافیایی به صورت عدد اعشاری
coords.accuracy دقت مکان‌یابی
coords.altitude حالیتی که ارتفاع دارد، از سطح دریا به سمت بالا به واحد متر اندازه‌گیری می‌شود
coords.altitudeAccuracy دقت ارتفاع موقعیت
coords.heading جهت، از شمال مثبت شروع می‌شود و به درجه
coords.speed سرعت، به میلیمتر در ثانیه
timestamp تاریخ و زمان پاسخ

موضوع Geolocation - روش‌های جالب دیگر

watchPosition() - موقعیت فعلی کاربر را بازمی‌گرداند و به طور مداوم موقعیت‌های جدید کاربر را در هنگام حرکت او بازمی‌گرداند (مثل GPS در ماشین‌ها).

clearWatch() - متوقف کردن روش watchPosition()

در اینجا مثالی از استفاده از روش watchPosition() آورده شده است. برای تست این مثال به یک دستگاه دقیق GPS نیاز دارید (مثلاً iPhone):

مثال

<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.watchPosition(showPosition);
    }
  else{x.innerHTML="این مرورگر پشتیبانی از موقعیت جغرافیایی نمی‌کند.";}
  }
function showPosition(position)
  {
  x.innerHTML="纬度: " + position.coords.latitude +
  "<br /> طول عرض جغرافیایی: " + position.coords.longitude;
  }
</script>

به طور شخصی امتحان کنید