Can I use my own animated gifs as markers in the Google Maps API?

Question

I want to use various animated cartoons (gifs) as markers on Google Maps; can i do this using the API?

Answer 1

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 need to use icon:icon-urlwhen creating a 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"
});

An example is here.

Answer 2

I suggested that you can do this:

function showMarkerFeature(p) {
var oF = new google.maps.Marker({
    map: map,
    position: p,
    //set the image src path here
    icon: "http://www.google.com/intl/en_us/mapfiles/ms/micons/red-dot.png" 
});
identifyMarker.setVisible(false);
map.setCenter(p);

return oF;
}