Here's his "How I did it":
- Downloaded the CTA's official maps and combined them into a single image in Photoshop.
- Downloaded a bunch of Google map tile images for reference, noting the coordinates in their URLs (example), and spliced them together.
- Stretched and skewed the CTA map so that it was aligned as closely as possible to the Google map. This was the most time-consuming part of the process, and it didn't turn out as perfect as I'd have liked. I blame it on the CTA map designers for not being precise enough. :-)
- Chopped the aligned CTA map into 128-by-128-pixel tiles that matched their corresponding Google map tiles exactly -- by size, shape and coordinates.
- Wrote a server-side Python script that handles dispatching images. (Ideally a future version of the Greasemonkey script would embed the map images in itself directly.)
- Wrote the Greasemonkey script that brings it all together.