Currently I am on a working trip in Sunnyvale. I came via San Francisco and I need to go to San Jose later on to return the broken rental car. I'll probably check visit the Facebook guys in Palo Alto afterwards.
This is a script that analyses the text content of an HTML element, finds geographical locations and automatically links them to Google Maps. Furthermore, it paints a static map and adds a list of all the locations to the element.
addmap.js you need to sign up for a Google Maps API key and embed the script in your document and call the
analyse method with the
id of the element you want to change as a parameter:
<script src="http://github.com/codepo8/geotoys/raw/master/addmap.js"></script> <script> addmap.config.mapkey = 'YOUR_API_KEY'; addmap.analyse('content'); </script>
View source of this page to see an example, but please get your own key!
You can override a few configuration settings of
addmap.config.mapkey- the Google maps key (mandatory)
addmap.config.height- the map dimensions
addmap.config.datacontains the geographical information that was found in the text once the script ran. This is useful for debugging and reuse of the data
Change the look and feel
Addmap creates the following HTML inside the element you enhance:
<div class="locations"> <img alt="Map" src="…"> <ul> <li><strong>1</strong> first location</li> <li><strong>2</strong> second location</li> […] </ul> <p class="branding">Powered by: Google Maps, Yahoo Placemaker and YQL.</p> </div>
Go nuts styling it.