I'm tweaking a customers website today and spending time tidying up some small issues. One of these issues was to display a Google Map widget for each of the companies three offices. This would have been super easy using a CMS like Drupal but this is to be added to a custom HTML5 website. Even so, "Sounds pretty straightforward" I thought and volunteered ;)
*sigh* After an hour of reading radically different google maps tutorials, trying (and failing) to get the maps to display, I was starting to mutter swear words. But then YAY! after a strong coffee, and an afternoon doughnut I was able to figure out the gremlins and see the maps in all their glory.
I finally got Google Maps embedded in my page, working lovely, using a mixture of code examples from various sources. Heavily modified, it works beautifully and of course, is hopefully very readable for any other code-monkey out there. So its time to write it down before it fizzles out of my brain forever. If you came here after googling (or bing'ing) every combination of "multiple map on one screen" possible then I hope this helps...
So you want to display more than one google map on your web page?