stop marker animation in google maps with multiple markers

Viewed 4310

I have a map integrated on my web page with marker animation. I have multiple markers in the map. I want to achieve something like, when any of the marker is clicked then other marker's animation should stop which is currently running.

Currently i am able to stop animation of the same marker on the marker click. There must be some marker object i should get in the case of multiple markers.

So far i have done this.

latlngarray is an array with lattitude and longitude in object format.

var centerlatlng={center lat lng are here};
var zoomlevel=zoomlevel is here;
function initMap(){
map = new google.maps.Map(document.getElementById('map'),{
    center: centerlatlng,
    zoom: zoomlevel
});

if(latlngarray.length > 0){
    for(i=0; i < latlngarray.length; i++){
        marker = new google.maps.Marker({
            position: latlngarray[i],
            map: map
        });

        marker.addListener('click', function(){
            toggleBounce(this);
            map.setZoom(10);
            map.setCenter(marker.getPosition());
        });
    }
}}

function toggleBounce(ele){
if(ele.getAnimation() !== null){
    ele.setAnimation(null);
}else{
    ele.setAnimation(google.maps.Animation.BOUNCE);
}}

fiddle

1 Answers
Related