Tworzę witrynę mobilną, mam tam zintegrowane Google Maps, muszę dynamicznie wypełniać pole „Od” w Mapach Google.
Czy można pobrać lokalizację GPS z przeglądarki internetowej i dynamicznie wypełnić ją w polu „Od” na Mapie Google?
Tworzę witrynę mobilną, mam tam zintegrowane Google Maps, muszę dynamicznie wypełniać pole „Od” w Mapach Google.
Czy można pobrać lokalizację GPS z przeglądarki internetowej i dynamicznie wypełnić ją w polu „Od” na Mapie Google?
Odpowiedzi:
Jeśli korzystasz z interfejsu API geolokalizacji , byłoby to tak proste, jak użycie następującego kodu.
navigator.geolocation.getCurrentPosition(function(location) {
console.log(location.coords.latitude);
console.log(location.coords.longitude);
console.log(location.coords.accuracy);
});
Możesz też mieć możliwość korzystania z interfejsu API lokalizacji klienta Google .
Ten problem został omówiony w artykule Czy można wykryć lokalizację GPS przeglądarki mobilnej? i Uzyskaj dane o pozycji z przeglądarki mobilnej . Więcej informacji znajdziesz tam.
Aby udzielić bardziej szczegółowej odpowiedzi. HTML5 pozwala uzyskać współrzędne geograficzne i wykonuje całkiem niezłą robotę. Ogólnie rzecz biorąc, obsługa geolokalizacji przez przeglądarki jest całkiem dobra, wszystkie główne przeglądarki z wyjątkiem ie7 i ie8 (oraz opera mini). IE9 spełnia swoje zadanie, ale jest najgorszy. Zamówienie caniuse.com:
http://caniuse.com/#search=geol
Potrzebujesz również zgody użytkownika, aby uzyskać dostęp do jego lokalizacji, więc upewnij się, że to sprawdzasz i podajesz przyzwoite instrukcje na wypadek, gdyby było wyłączone. Szczególnie w przypadku iPhone'a włączanie uprawnień dla Safari jest nieco uciążliwe.
Skorzystaj z tego, a wszystkie informacje znajdziesz pod adresem http://www.w3schools.com/html/html5_geolocation.asp
<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>
Istnieje API GeoLocation , ale obecnie obsługa przeglądarek jest raczej ograniczona. Większość serwisów, którym zależy na takich rzeczach, korzysta z bazy danych GeoIP (ze zwykłymi zastrzeżeniami co do niedokładności takiego systemu). Możesz również przyjrzeć się usługom stron trzecich wymagającym współpracy użytkownika, takim jak FireEagle .
Zauważalny
/*
function geo_success(position) {
do_something(position.coords.latitude, position.coords.longitude);
}
function geo_error() {
alert("Sorry, no position available.");
}
var geo_options = {
enableHighAccuracy: true,
maximumAge : 30000,
timeout : 27000
};
var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
*/
getLocation(): Observable<Position> {
return Observable.create((observer) => {
const watchID = navigator.geolocation.watchPosition((position: Position) => {
observer.next(position);
});
return () => {
navigator.geolocation.clearWatch(watchID);
};
});
}
ngOnDestroy() {
this.sub.unsubscribe();
}
Skorzystajmy z najnowszych funkcji grubych strzałek :
navigator.geolocation.getCurrentPosition((loc) => {
console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})