Make Your Google Map Stand Out With Styles

Look out, CloudMade. Google has just announced a new feature in its Maps API that lets developers control the underlying map imagery. Map Styling gives you control of colors and whether types of features are included in the map. Previously this level of map styling was only available by paying for underlying map data, or using the Open Street Map project that CloudMade is based upon.

Since Google put Maps V3 into production, this new feature is not available in the earlier maps version. The map embedded above makes the map a saturated blue color and removes point of interest labels and smaller roads. Click between the "Map" and "Edited" types to see the differences in lower Manhattan. Google has an example page with eight other styles, including one somewhat reminiscent of CloudMade's Midnight Commander.

One distinction between Google's new service and CloudMade's is that Google's lets you change your map with JavaScript code at the time the map is added to a page. CloudMade requires that you save a style and reference the ID from your code. On the other hand, the CloudMade style editor provides a point-and-click interface to all map features, with different styles for particular zoom levels. Google is not quite as customizable, but does have an auto-updating style wizard.

CloudMade has been popular with developers who don't want maps that look like all the others. Now we'll see whether being able to style the leading mapping API will bring them to Google Maps that don't look like Google Maps. Although, users probably won't be fooled. Even though your maps don't have to look like Google Maps any more, they still carry the Google logo.

Adam DuVander -- Adam heads developer relations at Orchestrate, a database-as-a-service company. He's spent many years analyzing APIs and developer tools. Previously he worked at SendGrid, edited ProgrammableWeb and wrote for Wired and Webmonkey. Adam is also the author of mapping API cookbook Map Scripting 101.



[...] to use OpenStreetMap, but perhaps the openness of OSM is more to your liking than Google Maps.  This post at Programmable Web highlights some of the differences between GMaps map styles and [...]

[...] your actual map imagery: Open Street Map beget CloudMade, which had to have inspired Google’s map styling. Now anyone can have a truly custom [...]

[...] site achieves the effect thanks to a new and mostly unused feature of Google Maps. The map styles feature uses CSS-like syntax within the map’s JavaScript, so that you can change colors of the map. [...]

[...] alterations are easy via Google’s styled maps, but Microsoft has no documented feature to change its map tiles. It’s likely we’re [...]

[...] Google styled maps launched, we said “look out Cloudmade.” The company based on OpenStreetMap data was by far the [...]

[...] styling is a popular feature. Google Maps styling was first announced in May 2010. At I/O it got its first major change, with even more options to [...]