Three ways to add Maps [May 30, 2011, 4:21 p.m.]
Back in our chat, there was a lot of interest in using the maps plugin with videos. If you've been thinking about doing that and want to know how -- this is it! Here are three options
Example 1: Map plugin showing Google Maps
Like other plugins, you will need to set aside a section in the page's HTML layout to hold the map:
<div id="mapdiv" style="width:400px;height:400px;"></div>
Then add some JavaScript with a list of important values that Popcorn will use to operate the map plugin.
.map({
start: 5, // show the map
end: 10, // end the map
location: "Boston, MA", // where to point the map
zoom: 12, // zoom level of the map
target: "mapdiv" // the ID of the map's place in the HTML
})
There are also options to set the map type (type: "ROADMAP", type:"SATELLITE", or type:"HYBRID"), or to set the latitude and longitude directly instead of using location: "placename". There's also StreetView, as described by the developer here: http://dseifried.wordpress.com/2011/02/08/popcorn-js-google-maps-streetview/
Working link: http://jsfiddle.net/tNhyt/15/
Example 2: OpenMap plugin showing OpenStreetMap
OpenMap works the same way as the Google Maps plugin, except with OpenStreetMap, NASA World Wind, and USGS terrain maps - all open data sources. OpenStreetMap usually loads reasonably well, but the others can be slow.
There is no StreetView available in OpenStreetMap.
Example 3: OpenMap plugin with clickable icons
The OpenMap plugin also supports adding clickable icons to your map. For example, this example ( http://mapmeld.appspot.com/popcorn.openmap.html ) adds a marker where the Vehicle Assembly Building is at NASA's launch center in Florida using this code: