웹 브라우저에서 GPS 위치 확인

모바일 기반 웹 사이트를 개발 중이며 Google지도를 통합했으며 Google지도의 '보낸 사람'입력란을 동적으로 채워야합니다.

웹 브라우저에서 GPS 위치를 가져 와서 Google지도의 '보낸 사람'입력란에 동적으로 채울 수 있습니까?

당신이 사용하는 경우 위치 정보 API를 , 다음 코드를 사용하여 단순하게 될 것이다.

navigator.geolocation.getCurrentPosition(function(location) {
  console.log(location.coords.latitude);
  console.log(location.coords.longitude);
  console.log(location.coords.accuracy);
});

Google의 고객 위치 API 를 사용할 수도 있습니다 .

이 문제는 모바일 브라우저의 GPS 위치를 감지 할 수 있습니까? 에서 논의되었습니다 . 및 모바일 브라우저에서 위치 데이터를 가져옵니다 . 더 많은 정보를 찾을 수 있습니다.

좀 더 구체적인 답변을 제공합니다. HTML5를 사용하면 지리적 좌표를 얻을 수 있으며 꽤 괜찮은 일을합니다. 지리적 위치에 대한 브라우저 지원은 ie7 및 ie8 (및 opera mini)을 제외한 모든 주요 브라우저에서 상당히 좋습니다. IE9는 그 일을하지만 최악의 수행자입니다. Checki caniuse.com :

http://caniuse.com/#search=geol

또한 사용자의 위치에 액세스하려면 사용자의 승인이 필요하므로이를 확인하고 꺼져있는 경우 적절한 지침을 제공해야합니다. 특히 아이폰의 경우 Safari에 대한 권한을 설정하는 것은 약간 성가신 일입니다.

이것을 사용하면 모든 정보를 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>

GeoLocation API 가 있지만 현재는 브라우저 지원이 다소 부족합니다 . 그러한 것들에 관심이있는 대부분의 사이트는 GeoIP 데이터베이스를 사용합니다 (일반적으로 그러한 시스템의 부정확성에 대한 규정이 있습니다). FireEagle 과 같은 사용자 협력이 필요한 타사 서비스를 볼 수도 있습니다 .

주목할 만한

/*
  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();
  }

최신 지방 화살표 기능을 사용합시다 :

navigator.geolocation.getCurrentPosition((loc) => {
  console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})