How to identify google maps marker on the map

Question

I have a list of google maps markers as html links next to a google map. I have the function that is triggered when I click on the link. Marker ID is passed to this function.

My question is - when I have 100 markers, I want somehow IDENTIFY the clicked marker on the map. Some sort of ripple effect that would go away from the marker.

please advice what are my possible options so I could develop appropriate solution

Example: 100 markers already on the map. I also have 100 names on the left. Each name corresponds to each marker. When I click the name, I want the marker that belongs to that name somehow "blink" or identify itself in some other way among other markers.

Answer 1

before the markers was pin on the map you need to set a global markers variable

var gb.markers = [];

while you create each marker need to push into global marker array

marker = new google.maps.Marker({
  // other stuff
  'id': marker.id
});

after you done with assign function to marker, push it into global var

gb.markers.push(marker);

make sure when you click on marker will get marker id and loop the global markers or make marker array with id as index

Answer 2

A ripple effect would be quite complicated, possibly involving positioning of a 'GroundOverlay' object centered around the marker you wish to highlight.

If your goal is just to be able to highlight the marker, perhaps playing a simple animation using 'Marker.setAnimation(animationObject)' . You could perhaps using 'Animation.BOUNCE' to highlight the marker?