Third Party Extensions

Google Maps API Tutorial

Animated Markers

From API v2.59, the API supports animated GIFs as markers in all browsersThe techniques described on the rest of this page are no longer necessary

You may have noticed that the API accepts GIF images as markers, but that animated GIF icons don’t work in IE. This is because the API loads the marker image with the “DXImageTransform.Microsoft.AlphaImageLoader” filter under IE, so that transparent PNG files are displayed correctly, and that filter doesn’t handle animated GIFs.

This example  shows three strategies for animating a marker.

The main v1 methods are no longer possible, so the only possibility is to use a third party extension.

The example shows three implementations of clickable animated markers using third party extensions. From left to right:

  1. Pure TLabel
    The contents of the TLabel are an animated GIF.
    addDomListener() is used on the TLabel div to catch mouse clicks and open an info window.
  2. TLabel plus GMarker
    The contents of the TLabel are an animated GIF.
    An invisible GMarker is plotted at the same location. The GMarker mouse target goes above the TLabel to catch the clicks and the GMarker shadow goes underneath.
  3. ELabel plus GMarker
    The contents of the ELabel are an animated GIF.
    An invisible GMarker is plotted at the same location. The GMarker mouse target goes above the ELabel to catch the clicks and the GMarker shadow goes underneath.ELabels overlap intelligently when the “overlap” property is set.
Advertisements