Tuesday 29 September 2009

Generating KML from CMS - and how to make mashups without a key

After a great thematic mapping timeout this summer, it feels good to start blogging again. In my first autumn post, I want to write about the benefits of using a Content Management System (CMS) to create KML documents. I will also show how you can create Google Maps and Google Earth mashups without a map key.

My office is currently running a UN relay race across Norway. 19 schools are participating, one school from each county. It's possible to follow the race on our webpage - on a 2-D map and as a 3-D tour. I wanted make a dynamic solution which could be reused and automatically updated as the race went on.

I ended up playing with our content mangement system. A well designed CMS should enable you to output content in various formats, not only HTML. We're using eZ Publish, maybe the best open source CMS in the world. eZ Publish enables you to create your own content classes and objects. Combined with the built-in template system, I was able to output my new content objects as KML instead of HTML.

One KML is generated for the lightweight 2-D map. You can embed this map on any webpage using an iframe containing a link to google maps and the KML. No Google Maps API key is needed, and the map is updated whenever the KML is updated by the CMS.

Show larger map

The other KML makes use of the new touring capabilities of Google Earth 5. By using KML scripting instead of JavaScript you can easily embed your tour on any webpage. This tour will show you all the schools participating in the relay race.

Every school are asked to make a letter which will eventually become a sentence.

My last tip-of-the-day:
When creating KML on the fly, you can benefit from some hidden features of the Google Chart API. The numbered map pins above are created with this API (it's a problem that Google Maps always renders KML icons as 32 x 32 pixels). KML only support images as screen overlays, but I was able to add dynamic text by using this feature of the Google Chart API (see top left corner of the tour).

1 comment:

SAM said...

Awesome tips. Can this be implemented in WordPress as well?