HTML5 جغرافیائی پوزیشن

HTML5 Geolocation(地理定位)用于定位用户的位置。

亲自试一试:在谷歌地图上显示您的位置

定位用户的位置

HTML5 Geolocation API 用于获得用户的地理位置。

鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。

浏览器支持

Internet Explorer 9、Firefox、Chrome、Safari 以及 Opera 支持地理定位。

注释:对于拥有 GPS 的设备,比如 iPhone,地理定位更加精确。

HTML5 - 使用地理定位

请使用 getCurrentPosition() 方法来获得用户的位置。

下例是一个简单的地理定位实例,可返回用户位置的经度和纬度。

实例


亲自试一试

例子解释:

  • 检测是否支持地理定位
  • 如果支持,则运行 getCurrentPosition() 方法。如果不支持,则向用户显示一消息。
  • 如果getCurrentPosition()运行成功,则向参数showPosition中规定的函数返回一个coordinates对象
  • showPosition() فونکشن لاتitudes اور longitudes کو حاصل اور نمائش کرتی ہے

مذکورہ مثال ایک بنیادی جیو لوسیشن اسکریپٹ ہے جس میں غلطیوں کا ہلول نہیں کیا گیا ہے。

غلطیوں اور رد کی رفتار کو ہلول کریں

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):

实例


亲自试一试