I wasn’t completely happy with the my last Google Maps/Weather Radar mashup. Two things I discovered; that Google Maps doesn’t update a KML loaded from the search function, and that the radar locations weren’t clear enough.

The later, radar visibility, was fairly east to correct. I added the transmitter points to the KML, and added a 10% magenta overprint to show the 200km range of the radar.

The first, I discovered that the Google Maps API is not completely in line with the KML reference, as that it doesn’t update images or dynamic content except with very specific controls. Google Earth KML’s have a <refreshMode> tag that allows users to declare expiration of data base on user behavior, a time delay, or expiration date and time. As far as I can tell, only the latter, onExpire, is supported by Google Maps. The options for using onExpire are based on either HTTP header settings, or setting an expiry time in the kml. The HTTP header settings are beyond my control with the hosting I use, and this left me with calculating a date/time stamp to be embedded in the KML.

At the suggestion of Coverfire, I calculated a proper date/time stamp during the web image grab, and just stuffed it into the KML, which in now assembled each time the script runs. The kit and kaboodle is uploaded to the server, which should allow users to get recent images when following the link.

Environment Canada Weather Radar on Google Maps

Or if you prefer Google Earth:

Environment Canada Weather Radar KMZ

A few things that came out of this clean up and finalization: Google Maps support of the KML is still really in beta, and is changing rapidly. And, Bash shell parameter expansion can drive you mad.

It’ll be interesting to see how long this mashup still works. I don’t see Google removing functionality, but they may streamline the KML import, and possible clean up some fuzzier aspects of refreshing dynamic content.

I spent two hours trying to get my shell scripts to crunch the date command to give me a nice ISO standard date 10 minutes in the future. Figuring that adding 600 seconds to the epoch time was the easiest, I just had date spit out epoch seconds and add 600. The most fun was getting all the variables to expand correctly while feeding it back to date.

Handy things to know about date:

To get the seconds since epoch:

date +%s

To get the date back from epoch time:

date –date=@EPOCHSECONDS

This option is incredibly handy for future dating as it makes the date command take care of what day/hour/minute is is when you add time. The only problem I found is nobody knows about it. Neither the wikipedia entry, nor the unixhelp page listed this option. I found it reading in the GNU manual. In fact, I don’t think I could have sorted out my difficulties with out this reference. Good one to know!

At this point, I think I’m happy with the look and operation of the Weather Radar KML. If you find any problems, or have suggestions, please leave me a note here, and I’ll look into it.

kgs

Note – Links have been removed because of updates…

So after much humming and hawing, I’ve finally sat down to complete my first Google Maps mashup. I had the idea a while back to drop the Environment Canada weather radar on top of Google maps to give my weather viewing some context. And a while back I cranked up a script to grab the radar image for my local transmitter (near Exeter, ON) and put it into ForecastFox Enhanced.

As it turned out, getting access to the Google Maps API and setting up a base map page was incredibly easy. A quick look into the Google Maps documentation and they even provided me with sample code to set up my first page. Then into the specifics of setting up overlays on Google Maps, and I’d be all set. Or so I thought.

I was using the GGroundOverlay object in GM (Google Maps) to drop my first test image on a map, and it worked great. So I thought I’d add a few more images to test out the local radar overlaps. It did not work. In fact, after much Javascript tweaking and re-ordering, I came to the following conclusion: GGroundOverlay is set up to work with ONE image only. Creating a second overlay either was completely invisible, or it broke the GM Javascript.

At this point, I decided to take a break from the web side, and look at how to handle the radar images. Give myself a break, as it were. So I made sure I had up to date copies of ImageMagick on my machine and my test server, and broke out the graphics editor hat. For those of you who have not used ImageMagick before, it is an incredibly powerful command line image editor. I would hazard a guess that 50% of workflow on Photoshop could be done in Imagemagick. Simply put, it rocks. In the case I forsaw, I would retrieve the radar images from the Enviroment Canada weather site, trim them down and remove extraneous colours and details. And thats just about the process that occurred.

The biggest trick with IM (ImageMagick) is to attempt to do the whole job on one command line. This prevents having to save temp image files, which will cost time lost in disk access and possible in quality of the image. That said, IM can only handle so many steps before it gets lost. The second complication, one I brought upon myself, is that radar images are in fact circular, so I only wanted to display the circular data area.

This led to probably my most frustrating time of the whole project. Simply put, I built an image the same size as the whole radar image from the web, cut out a circle where I wanted it, and filled the circle with the radar image. This gave me a black image, with a circular image centered over the radar site. Judicious cropping and colour removal, final application of transparency, and I had a .GIF to use for GM. As a side note, Enviroment Canada’s decision to make the radar image a 256 colour .GIF image and basically defining 1 pixel = 1 km made my job very easy.

This is where the only major flaw kept cropping up. When drawing the circle, IM kept antialiasing the edge to make it look nice, but when I removed colours, the nasty shades of grey defining the edge of the circle stayed around. I think I spent around three hours digging through the IM website until I finally tripped across the reference to the +antialias command. With this enabled, no grey edging, and the radar circles came out perfectly.

For those interested, here’s the IM command line as it ended up. It generates a 400 pixel square image with a active 400 pixel circle visible in the middle, set at 25% opacity using PNG alpha channel transparency.

convert +antialias -size 580×480 xc:black -tile radar.gif -draw ‘circle 240,239 240,39′ -fill black -opaque white -opaque \#999966 -opaque \#333366 -crop 401×401+140+139 -transparent black -matte -channel A -evaluate divide 1.25 output.png

Not to fetch the images. Lucky for me, Environment Canada builds the radar pages from a generated stream of data. Be researching the actual call signs of the transmitters in Wikipedia, and careful examination of the radar website, I developed a script that would wget the webpages, parse them with regex’s and then wget the radar images. A bit of research later, and some brushing up on BASH scripting, I now had a script easily configurable to get two or twenty images from the web. I then blended the IM script into it, and set it to copy the finished image products to my servers web share.

This led me back to how to display more than one image at a time in GM. About a month ago, I downloaded Google Earth on my Win partition again, and was rediscovering the fun of that app. Along with starting to upload photos to Panoramio, I discovered the XML structure used in Google Earth KML files. They supported multi-overlays with no problems, so I thought I’d build a Google Earth KML for the radar as a proof-of-type.

While researching the KML structure, I found the Google Maps Blog, and found that since the summer of 2007, GM supports some KML functions. If the KML (or KMZ; a zipped KML) is web accessible, you can type it into the GM search function, and it will display the KML over Google Maps. Here was all the tools I needed to finalize my Radar-over-Google Maps mashup.

My first KML in fact was a simple point declaration of all the Weather Radar transmitters in Ontario, verified and checked between Google Maps, Natural Resources of Canada topo maps and Environment Canada’s own website.

Ontario Weather Radar Sites in Google Maps

Using these verified locations, I build a spreadsheet that calculated the accurate Latitude/Longitude for a 400 km box around these stations, and used it to define the four sides of the display box for each weather radar image.

Combining this information with my previous KML file, I now had an accurate weather radar overlay displayable in Google Earth or in Google maps.

Ontario Weather Radar KMZ

Ontario Weather Radar in Google Maps

Watch this space! There will be improvement and development forthcoming.

kgs