Geolocation with add marker function

825 views
Skip to first unread message

Menghuy

unread,
Mar 1, 2019, 11:50:17 AM3/1/19
to google-map...@googlegroups.com
Hello, 
I tried to search on Internet a lot, but I couldn't find the answer.
Is it possible to use geolocation with addmarker function in Google map api javascript? 

Barry Hunter

unread,
Mar 1, 2019, 2:04:57 PM3/1/19
to google-maps-js-api-v3
Do you mean the browser Geolocation API?

... ie find the visitors location, and then let them create a Marker at that location?

Or maybe mean just show a fancy marker to 'show' the user their location?

... in short yes, should be able to use Geolocation API with the Maps API 

Something like this kinda demonstrates what would do... 

navigator.geolocation.getCurrentPosition(function(position) {
  addMarker(position.coords.latitude, position.coords.longitude);
});
function addMarker(lat,lng) {
  var marker = new google.maps.Marker({
    position
: {lat: lat, lng: lng},
    map: map
 
});
}


--
You received this message because you are subscribed to the Google Groups "[deprecated] Google Maps JavaScript API v3. Please use the latest post." group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-maps-js-a...@googlegroups.com.
To post to this group, send email to google-map...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-maps-js-api-v3.
For more options, visit https://groups.google.com/d/optout.

Menghuy

unread,
Mar 1, 2019, 8:02:10 PM3/1/19
to google-map...@googlegroups.com
Yeah thank you Barry. I want to know if i could use this 2 functions (geolocation and addmarker) together on the google map api javascript, because the geolocation function not working when there are add marker function on the same code.

Barry Hunter

unread,
Mar 2, 2019, 5:36:55 AM3/2/19
to google-maps-js-api-v3
Well fundermentally it should be possible. Sounds like some incompatibility with how you've combined them. 

But without seeing your code its hard to guess what happened. 

... if you post a link to your testing code, there might just be enough of us still in this group to take a look. 

Menghuy

unread,
Mar 3, 2019, 4:36:07 AM3/3/19
to google-map...@googlegroups.com
 var locations = [
      ['My Aunt house', 11.5609370, 104.8714615],
      ['My teacher house', 11.5609370, 104.8754615],
      ['jing', 11.5609370, 104.8734615],
    ];

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(11.5609370, 104.8714615),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var infowindow = new google.maps.InfoWindow();

    var marker, i;

    for (i = 0; i < locations.length; i++) { 
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}

function showPosition(position) {
  var myMarker = new google.maps.Marker({
    position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
  });
  map.setCenter(myMarker.position);
  myMarker.setMap(map);
}
getLocation();

Menghuy

unread,
Mar 3, 2019, 4:39:09 AM3/3/19
to google-map...@googlegroups.com
The add marker function work fine, however the geolocation function just ask to allow the location but not show the marker current location. Is it possible to make the current location visible along the added markers on the map? 
Reply all
Reply to author
Forward
0 new messages