Don't stare out the window to track Santa - use Google Maps or Earth instead!

Posted by Pamela Fox & Michael Ashbridge, Google Geo Team

As announced on the Google blog in November, we've partnered with NORAD to provide real-time Santa tracking via iGoogle, Youtube, Google Earth, and the Google Maps API. The tracking started at 2AM MST today, and will continue until Santa's finished his global route at 2AM tomorrow. And since we're all about dishing technical details here, we figured we'd give you an inside scope on the Maps API & KML implementations!

In the Maps API tracker (screenshot below), the map displays a Santa icon for his current location, gift icons for previously visited locations, and play icons for locations with embedded Youtube clips. Every 5 minutes, Santa's position updates to a new nearby location. Here are some of the Maps API features we used:

• The open sourced Marker Manager with a modification to auto-open the info window on the santa marker.
• GControl extensions to create the special 'Find Santa' and 'Zoom to World' left-hand controls.
• The newly added Terrain map type (G_PHYSICAL_MAP).
• Localized map controls and messages for the 6 supported languages, passed in through the hl= parameter in the script tag.

In the Google Earth KML tracker file (screenshot below), you'll see a 3-d model of Santa and his reindeer changing locations, with a smooth fly-in to each location.

The general design principle here is that every client should fetch the model of Santa only once and then, every minute or so, we simultaneously update its location and move the camera to the new position.

The basic mechanism is an initial file with two NetworkLinks: one to fetch the <Model> KML file, and one to fetch the <Update> KML file every 60 secs. The update uses <Change> to adjust the coordinates of the model's <Location>, and it also includes a new <LookAt> position.

The NetworkLink that fetches the update has <flyToView> enabled and the LookAt of the update KML is what drives the viewer to the new location of the model. The Updates in KML document provides additional details for those interested.

ExtInfoWindow 1.0: Ajax powered, CSS customization

Posted by Joe Monahan, Maps API Developer

I'm Joe Monahan, a 27 year old cyclist originally from South Plainfield, NJ and now living in Chicago, IL where I work the days away as a User Interface Engineer with Orbitz.com.

I'm excited to announce an addition to the Google Maps Open Source utility library: the ExtInfoWindow, an "extended" info window that allows much more customization than the standard info window. Have you ever wanted to tweak the look and feel of your map's info windows? With ExtInfoWindow and a little CSS you can customize your windows to fit the theme of your site. Do you have a lot of content to place in 50+ markers' info windows, slowing your page load time? ExtInfoWindow can retrieve its content as static HTML strings upon page load, or, for more efficient and real-time data, it can pull data dynamically via an Ajax call when the info window opens. On top of all that, the ExtInfoWindow also mimics the behavior of the regular GInfoWindow, panning the map when needed, closing itself when another window opens, etc.

Sounds too good to be true? Let's check out a quick demo. Given the current season, and the fact that I'm writing this while the snow is falling in Chicago, let's create an ExtInfoWindow around the theme of "winter." All of the window's styles come from an externally linked CSS file, while the content is supplied by an Ajax request to grab the lyrics to "Let it snow! Let it snow! Let it snow!". (I apologize in advance if the song gets stuck in your head)

Want to see more? Check out the class reference documentation and more examples. As always, please report any issues you find in the developer forum.

Let me finish up by thanking Pamela Fox for making such a great Open Source Utility Library, and for all the help in getting this utility integrated. Second, I have to thank the authors of "Beginning Google Maps Applications with Rails and Ajax: From Novice to Professional": Andre Lewis, Michael Purvis, Jeffrey Sambells, and Cameron Turner. The sample code in their book is really what jump-started this utility. Last but not least, I also have to give a quick shout-out to my team over at Orbitz Traveler Update for giving me the extra time to develop the ExtInfoWindow utility and release it as open source.

Disclaimer: These views are mine and not the views of OWW or (subsidiary). I am not a spokesperson for OWW or (subsidiary) and neither OWW nor (subsidiary) endorse any material, content and/or links or assume any liability for any of my actions.

Maps from another world

Posted by Michael Weiss-Malik, Geo Team

Google Moon and Google Mars are great examples of what can be done with the Google Maps API. But in the rush to get both products out the door, we never quite got around to going the extra step and providing support in the Maps API itself for the tiles that Google Moon and Google Mars use. Until now, that is!

Fresh out of the oven, Maps API v2.95 includes explicit support for Moon and Mars map types. Want to plan your next moon landing, maintain a database of alien colonies, or just keep track of things you've lost on Mars? All these things and more are now just as easy to do as creating any other Maps mashup. The sky's the limit!

Speaking of the sky... while we were at it, we didn't stop at Moon and Mars tiles. We added support for Google Earth's sky imagery, too. That's right, you can now use the Maps API to create web-based versions of the cosmos, pulling from our huge tileset of merged telescope images. Note that we haven't yet perfected inter-galactic geocoding or driving directions, so you'll have to stick to Earth maps when you want to search for pizza joints and coffee shops. At least for now.

Michael Kosowsky of HeyWhatsThat.com was kind enough to whip up some great example applications that make use of these new map types. You can use his Cosmic Visibility page to see and understand the phases of the Moon or Mars. You can even see where the planets are in the sky, and where the horizon is, custom-drawn for your specific time and location. We hope these are just the first of many science mashups created from this feature.

All of this is made possible by the following pre-defined GMapType constants, which were added in the v2.95 Maps API:

• G_MOON_ELEVATION_MAP
• G_MOON_VISIBLE_MAP
• G_MARS_ELEVATION_MAP
• G_MARS_INFRARED_MAP
• G_MARS_VISIBLE_MAP
• G_SKY_VISIBLE_MAP

These work just like the familiar G_NORMAL_MAP and G_SATELLITE_MAP constants. See our examples for more info. As a teaser, here's a quick demo:

Be aware that the sky data is referenced to the celestial coordinate system, which takes some getting used to for us Earth-dwellers. The vertical axis is known as declination, and the horizontal axis is right ascension (which increases to the left, unlike longitude which increases to the right). A good search engine can be used to help you find more info on this coordinate system. We also have some documentation of our own on this topic, for those interested in overlaying KML on the sky in Google Earth. Note that KML isn't yet fully supported on sky maps, due to the coordinate system reversal.

Now go create some other-worldly maps!

The GoogleBar: Now with Options!

Posted by Pamela Fox, Maps API Team

About a month ago we introduced Gmap2.enableGoogleBar(), a command that puts our normal logo against a white background and adds an expandable local search box. The local search box is based on the configurable LocalSearchControl, so developers immediately asked when they'd be able to use the same options for the GoogleBar.

Well, a ton of you clamored for customization, so we put a rush order on it. Now, in v2.95, we have a new GMapOptions option: googleBarOptions (I know, so many options!). Those options will get fed into the LocalSearchControl when you call enableGoogleBar. It currently supports all the same options as the LocalSearchControl (with some constants renamed to our namespace), and also adds a showOnLoad boolean to let you pop out the search box upon map load. You can play with the options in the playground below to see some simple customization - but I bet that with all the callbacks available, you can come up with more innovative uses of the control than alerting after the search is complete. :) As always, please post questions (or examples of what you've done) in the forum.

Using the Chart API in KML for Quick Data Visualization

Posted by Mano Marks, Geo API Team

Google just released the the Google Chart API. We don't often boast about other non-Geo APIs in this blog, but this one is amazing, easy to use, and, best of all, has great potential for use in Geo apps.

Using the chart API is simple. By passing various parameters in the URL to the chart server, you can control how the chart looks in the image that is returned. Your custom chart image can be placed in Maps API info windows, KML balloons, etc. Let's look at how that second scenario works.

Let's suppose that you wanted to show pizza deliveries at particular locations based on significant points in a romantic relationship. You know how it goes — someone likes pizza, they order it. When they get involved with someone, sometimes they order at a that person's house, so deliveries go down. Around the holidays, they eat less pizza because they're going to parties, but when they break up with someone, they eat a lot of pizza because they're lonely and depressed at home. Very sad. Anyway, I've created a sample using KML, and I placed it in a park in New York so no one thinks I'm watching their actual pizza consumption.

<?xml version="1.0" encoding="utf-8"?>
<kml xmlns="http://earth.google.com/kml/2.2">
  <Placemark>
    <name />
    <visibility>1</visibility>
    <Snippet>Relationship versus Pizza</Snippet>
    <description><![CDATA[<img src="http://chart.apis.google.com/chart?cht=bvs&
chs=200x150&chd=t:10,15,25,13,3,35&
chxt=x,x&chxl=0:|Jul|Aug|Sept|Oct|Nov|Dec|1:|Start|||Thanksgiving||Breakup&
chtt=Pizza%20Deliveries|by%20Relationship%20Progress"/>]]></description>
    <Point>
      <coordinates>-74.01490535558324,40.70396174218289,0</coordinates>
    </Point>
  </Placemark>
</kml>

See, pretty simple. I'll leave it up to you exploring the Chart API documentation to get more info on creating the chart, but I wanted to show something else you could do with KML 2.2. This will only work in Google Earth, but it's pretty cool. You use the new <ExtendedData> and <Data> elements to create a Balloon template, putting the entity replacements (those codes that look like: $[something]) in the URL. That way, you can put only the data relevant to a particular point in a particular balloon, and you don't have to recreate the whole URL for each <Placemark>. And if you change the chart, but not the data, all you have to change is one <BalloonStyle>.

<?xml version="1.0" encoding="utf-8"?>
<kml xmlns="http://earth.google.com/kml/2.2">
  <Document>
    <name></name>
    <open>1</open>
    <Style id="pizza">
      <BalloonStyle>
        <text><![CDATA[<img src="http://chart.apis.google.com/chart?cht=bvs&chs=200x150&chd=t:$[PizzaDeliveries1],$[PizzaDeliveries2],$[PizzaDeliveries3],$[PizzaDeliveries4],$[PizzaDeliveries5],$[PizzaDeliveries6]&chxt=x,x,y&chxl=0:|$[PizzaDeliveries1/displayName]|$[PizzaDeliveries2/displayName]|$[PizzaDeliveries3/displayName]|$[PizzaDeliveries4/displayName]|$[PizzaDeliveries5/displayName]|$[PizzaDeliveries6/displayName]|1:|$[RelationshipDataPoint1]|$[RelationshipDataPoint2]|$[RelationshipDataPoint3]|$[RelationshipDataPoint4]|$[RelationshipDataPoint5]|$[RelationshipDataPoint6]&chtt=Pizza%20Deliveries|by%20Relationship%20Progress"/>]]></text>
      </BalloonStyle>
    </Style>
    <Placemark>
      <name>Pizza Deliveries</name>
      <styleUrl>#pizza</styleUrl>
      <...
      <ExtendedData>
        <Data name="PizzaDeliveries1">
          <displayName>Jul</displayName>
          <value>10</value>
        </Data>
        ...
      </ExtendedData>
...

You can find the full sample here: here. For more info about creating templates, check out Adding Custom Data.

v2.94: Terrain and a New MapTypeControl to show it off!

Posted by Pamela Fox, Maps API Team

As announced on the Google Lat Long Blog last week, Google Maps has added a new Terrain map type that displays physical features and, quite frankly, is just dang pretty to look at. If you haven't tried it out yet, search for Mount Everest, the Grand Canyon, Glacier Bay National Park, or any other place that's suffered (enjoyed?) the natural forces of erosion and tectonic activity. We didn't enable the Terrain map type by default in the API as we didn't want to "surprise" developers and suddenly pop a new button on your maps, but we have made it very easy to add this type. Just insert code like this after initializing GMap2 to get a Terrain button on your map: map.addMapType(G_PHYSICAL_MAP);

In addition to the new map type, another subtle change was made to the Google Maps interface: the Hybrid button was removed, and was replaced with a drop-down menu under the Satellite button with a Show Labels checkbox. This new UI reflects the fact that the hybrid layer really just consists of satellite tiles combined with a transparent tile layer of information from the standard map tiles. We've released this new UI functionality to developers within the GHierarchicalMapTypeControl. The new control defines functions to add relationships to the control so you can specify how these drop-down lists will appear. For information on how to set up these relationships, see Modifying the Makeup of Standard Controls in the API documentation.

For those who want to mimic the current maps UI, just replace your GMapTypeControl object with a GHierarchicalMapTypeControl object — the existing G_SATELLITE_MAP/G_HYBRID_MAP relationship is specified by default. For those who want to use this control for their custom maps, however, you can clear the defaults and specify whatever relationships make sense for you.

As an example, I used the awesome Google Maps Creator java application from UCL-CASA to turn freely available ESRI SHP files into tile layers. After getting the custom map API code generated automatically by the application for all my layers, I combined them into one map and added in the new map type control. The result is a map with a drop-down that lets you switch between the four tile layers (various data for San Francisco county). Try it out below — and hopefully you'll be inspired to use the control for your own custom maps! As always, please post questions in the forum.