i'm new to javascript, hope you'll forgive me my bad if i'm doing something wrong.
In fact, i've allready found a solution for my problem, but i don't get how exactly get it into my own code.
Google Maps API - bouncing marker issue
Unfortunately i can't just comment it because i'm new on stackoverflow.
My Problem:
I'm working on a map with several markers on it. If i click on a marker, i want it bouncing and switching its color by a different icon i set. All fine till this point, but at the moment all markers i clicked won't stop bouncing. I want the marker bouncing, till i click another marker. At this point the "old" marker should stop bouncing and just the new one start.
//Marker Icons
var unvisitedMarker = 'img/m1.svg';
var activeMarker = 'img/m2.svg';
var visitedMarker = 'img/m3.svg';
//Add Marker Function
function addMarker(props) {
marker = new google.maps.Marker({
position: props.coords,
map: map,
icon: unvisitedMarker
});
//Opens marker information
var marker.addListener('click', function() {
document.getElementById("paperContainer").style.top = '40vh';
document.getElementById("locationBar").style.top = 'calc(40vh - 2em)';
map.panTo(marker.getPosition());
//Panby the map-position
map.panBy(0, 350);
//Set active Marker Icon
marker.setIcon(activeMarker);
//Set Marker Animation
marker.setAnimation(google.maps.Animation.BOUNCE);
});
}
So i got this code from the other Thread i linked from user "doublesharp":
// track marker that is currently bouncing
var currentMarker = null;
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
document.getElementById('loc-info').innerHTML = html;
// remove the bounce from the "old" marker
if (currentMarker) currentMarker.setAnimation(null);
// set this marker to the currentMarker
currentMarker = marker;
// add a bounce to this marker
marker.setAnimation(google.maps.Animation.BOUNCE);
});
}
I don't know exactly how to implement this in my owm code. And further - how do i get realized to switch the icon after it stoped bouncing to the "visitedMarker"?
Thank you very much in advance!