GoogleMaps marker click event


#1

I want when the user clicks on a marker, I would like a popup displays to him with some information (for example: let’s say the markers represent locations, when he clicks on a marker it displays to him all information of this location)

What is the simplest way to do this?


#2

Assuming you declare your marker like so:

let marker = new google.maps.Marker({
  position: myLatlng,
  map: map,
  title: 'Click to do something'
});

You can just add a click listener to it like so:

marker.addListener('click', function() {
  // your code here
});

#3

Perfect it worked :wink:

var locations = Locations.find();
// set all markers in the Map
locations.forEach(function(doc){

var marker = new google.maps.Marker({
position: new google.maps.LatLng(doc.screenLatitude, doc.screenLongitude),
title: doc.screenDimension,
icon:‘http://maps.google.com/mapfiles/ms/icons/blue-dot.png
});
marker.setMap(map1); // map1 is my Google Map
marker.addListener(‘click’, function() {
// your code here
console.log(“Marker clicked”);
});

Still need displaying a popup…


#4

https://developers.google.com/maps/documentation/javascript/infowindows


#5

Thank you for the reply


marker.addListener(‘click’, function() {
infowindow.open(map, marker);
});


Doesn’t work for me I don’t know why, but I try something else and it’s okay:


marker.addListener(‘click’, function() {
swal({
title: “More details”,
text: “Type what you want here”,
});
});


Best regards :slight_smile: