CODEWITHSUNDEEP
google-maps
user3766930
user3766930

Reputation: 5829

how can I show user's location on embed google map?

I'm following the tutorial from here https://developers.google.com/maps/tutorials/fundamentals/adding-a-google-map

and this code:

<!DOCTYPE html>
<html>
  <head>
    <style>
      #map {
        width: 500px;
        height: 400px;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js"></script>
    <script>
      function initialize() {
        var mapCanvas = document.getElementById('map');
        var mapOptions = {
          center: new google.maps.LatLng(44.5403, -78.5463),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(mapCanvas, mapOptions)
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map"></div>
  </body>
</html>

works like a charm. But it always shows the coordinates: 44.5403, -78.5463. Is there any way to change it so that when user enters my page from new york, he will see the map of new york, and the guy from sydney will see sydney, etc?

Thanks!

Upvotes: 0

Views: 363

Answers (1)

Serafins
Serafins

Reputation: 1247

To do that, you have to use geolocation.

Here is an example:

navigator.geolocation.getCurrentPosition(function(position) {
      var pos = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      };

Upvotes: 1

Related Questions