سیستم موقعیت یاب HTMLبرای پیدا کردن موقعیت یک کاربر استفاده می شود.
پیدا کردن موقعیت کاربر
بوسيله سيستم موقعيت ياب جهاني Html5 مي توان موقعيت جغرافيايي يک کاربر را پيدا کرد. اين سيستم از اطلاعات ماهواره ها و ISP اي که به آن متصل هستيد، براي اطلاع از موقعيت شما استفاده مي کند.
از آنجايي که موقعيت يابي مي تواند حريم خصوصي کاربر را تحت تاثير قرار دهد، موقعيت وي تا زماني که خودش تاييد نکند، در اختيار برنامه قرار نخواهد گرفت.
پشتیانی در مرورگر های مختلف :
این تگ در تمام مرورگرهای اصلی (Internet Explorer 9+, Firefox, Opera, Chrome, Safari) پشتیبانی می شود .
نکته: سيستم موقعيت ياب HTML5 در دستگاه هايی که دارای GPS هستند دقيق تر کار می کند (مانند iPhone).
اطلاع از موقعیت کنونی کاربر – متد () getCurrentPosition :
از این متد می توان برای اطلاع از موقعیت دقیق کاربر استفاده نمود .
مثال زير يک کد ساده موقعيت يابی را نشان می دهد که بوسيله آن عرض و طول جغرافيايی مکان کاربر، نمايش داده می شود:
<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>
توضیح مثال بالا :
-
در مرحله اول چک شده که آیا مرورگر از سیستم موقعیت یاب در HTML پشتیبانی می کند یا خیر تا در صورت لزوم کد های مناسب اجرا شود .
-
اگرمرورگر از این سیستم پشتیبانی کند متد () getCurrentPosition اجرا شده و در غیر این صورت یک پیام هشدار مبنی بر عدم پشتیبانی مرورگر صادر می شود .
-
اگر متد () getCurrentPosition با موفقیت اجرا شود مختصات نقطه قرارگیری کاربر را بوسیله یک پارامتر به تابع () ShowPosition برمیگرداند .
-
متد ShowPosition موفقیت کاربر را بر روی خروجی نمایش می دهد .
مديريت خطاها و عدم جوابگويی سيستم
از پارامتر دوم متد () getCurrentPosition برای مدیریت خطا های احتمالی استفاده می شود . این پارامتر یک تابع را تعیین می کند تا در صورت بروز خطا اجرا شده و پیام لازم را به کاربر نمایش دهد :
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;
}
}
توضیح موارد کد :
-
Permission denied - در این حالت کاربر اجازه دسترسی به موقعیت خود را نداده است .
-
Position unavailable -در این حالت یافتن موقعیت صحیح کاربر به علت مشکلات فنی ممکن نیست .
-
Timeout- در این حالت مدت زمان لازم برای اجرای درخواست تمام شده است .
-
Unkown error - خطای ایجاد شده نا مفهوم است .
نمايش موقعيت کاربر بر روی يک نقشه
برای اینکه نتیجه در یک جدول نشان داده شود، به یک سرویس دهنده نقشه (مانند Google Maps) نیاز دارید.
مثال :
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+"'>";
}
در مثال بالا، از طول و عرض جغرافيايي براي نمايش موقعيت کاربر در Google Maps استفاده شده است. (از يک عکس استاتيک استفاده شده است)
داده هايي که متد ()getCurrentPosition برمي گرداند.
اگر متد ()getCurrentPosition با موفقيت اجرا شود، يک شيء برمي گرداند. خصوصيت هاي latitude ,longitude و accuracy هميشه برگردانده مي شوند. در جدول زير ديگر خصوصيت هاي اين شيء آورده شده است:
|
خصوصیت |
توضیحات |
|
coords.latitude |
عرض جغرافیایی |
|
coords.longitude |
طول جغرافیایی |
|
coords.accuracy |
دقت و درستي مکان کاربر |
|
coords.altitude |
ارتفاع بر حسب متر |
|
coords.altitudeAccuracy |
دقت و درستی ارتفاع مکان کاربر |
|
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 = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>