I want to use different animated cartoon images (gifs) as markers on Google Maps; can I do this with the API?
Yes you can Live Example):
var position = new google.maps.LatLng(59.219521,15.1419873);
var marker;
var map;
function initialize() {
var mapOptions = {
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: position
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
marker = new google.maps.Marker({
map:map,
draggable:false,
animation: google.maps.Animation.DROP,
position: position,
icon: "http://heera.it/wp-content/themes/heerait/img/blog/me.png"
});
}
You just need to use icon:icon-url
when creating the marker.
Update:
marker = new google.maps.Marker({
map:map,
draggable:false,
optimized:false, // <-- required for animated gif
animation: google.maps.Animation.DROP,
position: position,
icon: "http://blogs.technet.com/cfs-file.ashx/__key/communityserver-blogs-components-weblogfiles/00-00-01-01-35/e8nZC.gif"
});
Example Here.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With