Friday, August 29, 2008

MapIconMaker 1.1: Create Dynamic Flat and Labeled Icons!

In the first release of MapIconMaker, we gave developers the ability to create dynamically resized and colored marker-shaped icons. Now with the second version, we're adding two entirely new types of customizable icons. The table below (stolen blatantly from the documentation) compares the three available functions. To get more of a feel for everything that's possible with all the icons, play around with the updated wizard.


createFlatIcon The icons can be dynamically sized and colored, can be either circular or rectangular in shape, and can have text overlaid on them. They will appear to lie 'flat' on the map because of their shape.
View example (createflaticon-simple.html).
createLabeledMarkerIcon The icons can be dynamically colored and can have text overlaid on them, but can only be one shape and size (marker-shape, 32*32). They can optionally have a dynamically colored star attached to the corner.
View example (createlabeledmarkericon-simple.html).
createMarkerIcon The icons can be dynamically sized and colored, but cannot have any text overlaid on them.
View example (createmarkericon-simple.html).

As a demo of what kind of maps are possible with the new icons, I've created a gadget that uses the Visualization API to pull rows of U.S. address data from a Google Spreadsheet, clusters the rows based on what state code I find in the address (yay for RegEx!), and then creates icons for each state cluster that are dynamically sized and labeled according to the size of the cluster. As an added touch, I overlay a transparent state polygon on marker mouseover, and I change the color of the marker and polygon on marker click. Much thanks to the 2008 Election Trends map for inspiring the UI and making its code and states data available.

Check out the demo map below, and if you're inspired yourself, read through the MapIconMaker reference and documentation (or code - it's open source!).