Share via


Геолокация с помощью Internet Explorer 9

 

В IE9 вошли функции геолокации, которые работают на базе данных Wi-Fi точек доступа и IP адресов.

Процесс определения координат в браузере осуществляется с помощью обьекта geolocation который является потомком window.navigator.

Собственно geolocation объект достаточно прост, у него есть метод получения текущих координат getCurrentPosition и событие изменения координат watchPosition.

Каждый из этих методов сразу приводит к результату, и это не координаты, методы эти асинхронны. На вход этих функций надо обязательно подать callback метод который уже будет вызван в случае успешного определения координат.

window.navigator.geolocation.getCurrentPosition(show_map);

 

function show_map(position) {

    var latitude = position.coords.latitude;

    var longitude = position.coords.longitude;

}

 

 

 

Важно понимать, что раз мы имеем дело с асинхронным вызовом, невозможно предсказать через какой промежуток времени придут координаты. Поэтому в реальных проектах лучше указывать время таймаута, после которого пользователь будет уведомлен о том что определить координаты не удается.

Простая страница которая будет выводить текущие координаты выглядит так:

<!DOCTYPE html>

<html>

<head>

<title>Geolocation API Example</title>

<meta http-equiv="X-UA-Compatible" content="IE=9" />

<script type="text/javascript">

 

function setText(val, e) {

    document.getElementById(e).value = val;

}

 

function insertText(val, e) {

    document.getElementById(e).value += val;

}

 

var nav = null;

 

function requestPosition() {

  if (nav == null) {

      nav = window.navigator;

  }

  if (nav != null) {

      var geoloc = nav.geolocation;

      if (geoloc != null) {

          geoloc.getCurrentPosition(successCallback);

      }

      else {

          alert("geolocation not supported");

      }

  }

  else {

      alert("Navigator not found");

  }

}

 

 

 

function successCallback(position)

{

   setText(position.coords.latitude, "latitude");

   setText(position.coords.longitude, "longitude");

}

 

 

 

</script>

</head>

<body>

<label for="latitude">Latitude: </label><input id="latitude" /> <br />

<label for="longitude">Longitude: </label><input id="longitude" /> <br />

<input type="button" onclick="requestPosition()" value="Get Latitude and Longitude" />

 

</body>

</html>