Google Maps: Border on Markers

Question

I\'m trying to display photos as markers on Google Maps. This is no problem by redefining the marker as an image, but I want to put some sort of border or shadow to make them st

Answer 1

@Cinetik's comment led me to overcome a conceptual barrier. I, too, was trying to use RichMarkers in my app, and I too was trying to animate them. When I discovered that RichMarker's setAnimation doesn't just work, I too was furious. Then I made that comment above,

"I'd like to have my rich marker and animate it too"

and realized my misconception. I am sharing my answer for posterity:

Google map's Marker has all kinds of crazy features, like out-of-the-box animations. It doesn't allow for HTML/CSS/JS manipulation, though, because it doesn't produce clean HTML markers. If you want that, you need RichMarker. The problem is, you can't have you cake and eat it too. If you opt-in to RichMarker's elegant HTML/CSS/JS integration, you automatically opt-out of some of the nicer features of the plain Marker. You can implement them yourself, if you want, and having that freedom is exactly why you chose RichMarker in the first place, isn't it?

So, here is some code to add a bounce animation to a RichMarker using jQuery and the amazing 'bez' plugin by rdallasgray.

// create a marker using our element
var marker = new RichMarker({
    content: $("myElement").get(0)
});

// now animate that element!
$("#myElement").animate({ left: -100 }, 500, $.bez([0,0,0.6,1]));

I hope that helps someone!