Как определить месторасположение через javascript

Вставьте в html документ следующий js скрипт для определения координат локации (широты и долготы в десятичных значениях):


getloc();
 
function getloc(){
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(
        positionCallback, function (error){
            console.log ("Error : " + error.code + " " + error.message);
            }
        );
    }else{
        console.log ("location is disabled");
    }
}
 
function positionCallback(pos){
    console.log (pos.coords.latitude);
    console.log (pos.coords.longitude);
    console.log (pos.coords.accuracy); // точность месторасположения в метрах
}

 

Браузер получает локацию своими внутренними методами используя API Geolocation, лиса например использует для этого запрос POST www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyD_Drzahe4dBzGCZ9ArvowCvrPx_yFrlCM HTTP/1.1

Другие браузеры используют свои ключи, которые получены у гугл.

 

 

Как показать месторасположение на карте

 

Для этого нужно получить ключ API в гугле

https://console.developers.google.com/flow/enableapi?apiid=maps_backend,geocoding_backend,directions_backend,distance_matrix_backend,elevation_backend,places_backend&reusekey=true

В head нужно добавить

<script src="https://maps.googleapis.com/maps/api/js?key=Your_API_key"></script>

 

На странице определить место, где будет выводится карта:


<div id="map" style=" width:600px; height:600px;">

 

Добавляем функцию вывода карты на экран:

 

function showGoogleMap(coords){
    var googlecoords = new google.maps.LatLng (coords.latitude,coords.longitude); // создаем объект google.maps.LatLng с полученными координатами широты и долготы
   
    var mapOptions ={// еще один объект с параметрами карты
        zoom:17,
        center: googlecoords,
        mapTypeId: 'roadmap'
    };
   
    var mapDiv = document.getElementById("map"); // получаем место html куда всунуть карту с выбранными размерами
    var map = new google.maps.Map (mapDiv, mapOptions); // наконец делаем объект карту и выводим на экран  
}

 

И в функцию positionCallback() добавляем вывод карты:

 

showGoogleMap(pos.coords);

 

 

Как добавить маркер смотрите тут

Как сделать обновления определения месторасположения смотрите тут

 

 

Полная инструкция лежит тут: https://developers.google.com/maps/documentation/javascript/tutorial

Как запретить получения расположения в браузере читайте тут.



Оставить свой ответ:

Имя:*
E-Mail:
Вопрос:
Skolko buдет пять пдюс сeмь?
Ответ:*
QQpedia21.ru - cамые интересные вопросы