Search code examples
htmlgoogle-mapsgeolocation

Webpage using html5 geolocation not as accurate as Google Map?


Using web browser Chrome on my laptop, I opened a local html web page to get the current location. The returned location (1.3238272, 103.8606336) is no where close to my actual location. Similarity, websites like [1] (1.3238272 103.8606336) [2] (1.32383, 103.86063) all return not accurate results.

However, using google map, it returned (1.287264, 103.831497) a much accurate location. Do google map use a different approach/technology to obtain a location?

<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>

    <script>
        var g_lat = 0;
        var g_lng = 0;
        var map, infoWindow;
        function initMap() {
            navigator.geolocation.getCurrentPosition(updatePosition);
            map = new google.maps.Map(document.getElementById('map'), {
                center: {lat: g_lat, lng: g_lng},
                zoom: 8
            });
            infoWindow = new google.maps.InfoWindow;
        }
        function updatePosition(position) {
            var pos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude
            };

            infoWindow.setPosition(pos);
            infoWindow.setContent('Location found.');
            infoWindow.open(map);
            map.setCenter(pos);
        }

    </script>
    <script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
    async defer></script>
  </body>
</html>

Solution

  • The mistake is using Google Map when user logged in, this will produce a better location result. Without logging in, resulting location is the same as geolocation.