Google Maps API Icon Shadowmaker

Automatic shadow maker for Google Maps icons

It is easy to program custom markers for the Google Maps API, but getting the right shadow behind your icon is difficult. I personally don't like to spend lots of time in image editing software for tasks that can be automated. Having read several descriptions for creating the kind of semi-3d shadow that is expected for a marker icon in the Maps API, I wrote a Java2D-based application to automate this task.

Start Shadowmaker

It performs these steps:

1. Create a grayscale version of the original image, using the alpha channel value to determine the grayness.
2. Scale this image to half its height and shear it by 45 degrees.
3. Blur this image around its edges.
4. Take the image from step 2, make it slightly smaller and draw it on top of the blurred shadow from step 3. (The Umbra)

The application allows you to upload an image for which it will generate a shadow image. The result is previewed in several situations, and you can plot it on a map as well. The download link finally allows you to retrieve the shadow image and use it in your own websites. There are no restrictions whatsoever on the use of the generation shadow.

Have fun!

Send feedback

References:

• Creating custom map markers tutorial
• Google Maps API - Markers and Icons overview