Bounce a pin in google maps once

Question

I want to bounce a pin on a google map once. The following code will make the marker bounce but it just keeps going...

myPin.setAnimation(google.maps.Animation.BOUNCE);

Then calling

myPin.setAnimation(null);

makes the animation stop. Setting a timeout works but the duration of a bounce doesn't look like it is a round number so doing this

  setTimeout(function(){ myPin.setAnimation(null); }, 1000);

Make the bounce animation end prematurely and look terrible.

Does anyone know of a better way to accomplish this?

Answer 1

Thanks, for the good answer, I just integrated adding a bit of millisenconds

function toggleBounce(currentIcon) {
 currentIcon.setAnimation(null);

if (currentIcon.getAnimation() != null) {
  currentIcon.setAnimation(null);
 } else {
   currentIcon.setAnimation(google.maps.Animation.BOUNCE);
   setTimeout(function(){ currentIcon.setAnimation(null); }, 900);
 }
};

Answer 2

At the moment there is no built in animation for bouncing once.

If you are OK with it bouncing twice then i strongly suggest that you use this:

marker.setAnimation(4);

Answer 3

  marker.setAnimation(google.maps.Animation.BOUNCE);
        setTimeout(function() {
             marker.setAnimation(null)
        }, 6000);

Answer 4

Bit of a simple approach: Google's bounce animation appears to take exactly 750 ms for one cycle. Thus, simply set the timeout to 750 ms and the animation will stop exactly at the end of the first bounce. Works for me on FF 7, Chrome 14 and IE 8:

    marker.setAnimation(google.maps.Animation.BOUNCE);
    setTimeout(function(){ marker.setAnimation(null); }, 750);

Answer 5

use this code:

animation:google.maps.Animation.DROP

Answer 6

Just a note: if you're triggering this on multiple markers, you'll want to check to make sure the marker's not currently animating by adding the following code before you call marker.setAnimation( google.maps.Animation.BOUNCE );:

if( marker.animating ) { return; }