Hi James,
I haven''t tried your code, but see a couple issues. Firstly, the swap
function contains two arguments:
* Mapstraction''s name for the provider to swap TO
* The ID of the map div to swap TO
I believe you also need a div for each map provider. So, right now the
Microsoft map is in the ''mapstraction'' div. To swap to Google
you''d need a
second div (let''s call it ''secondmapdiv'') then
you''d call this line:
mapstraction.swap(''google'', ''secondmapdiv'');
Again, I haven''t checked the code. Someone else may feel free to chime
in,
but try out the above and let the list know how it works.
--Adam
On Sun, Feb 20, 2011 at 4:32 PM, The Headliner <pwheadliner at
gmail.com>wrote:
> Hi there,
>
> I recently discovered Mapstraction by following an example on Web Monkey -
> http://www.webmonkey.com/2010/02/multi-map-with-mapstraction/ - and using
> their code works great. However, I am now trying to also make use of the
> "swap" function, and not getting anywhere with it.
>
> In my page below, you see there is a button right at the end. I''d
hoped
> that clicking this would turn the Microsoft map into a Google map, but
> instead the map just disappears altogether, with Internet Explorer
reporting
> the JavaScript error "''this.currentElement.style'' is
null or not an object"
> (Line 249, Char 5), referring to the file mapstraction.js.
>
> I''m not a regular JavaScript user so whatever I''m doing
wrong is probably
> very obvious to most. In which case, can anyone please advise me on what I
> need to change to achieve the desired effect with this button?
>
> Many thanks,
>
> James
>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
> http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
>
> <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
>
> <head>
>
> <title>My Mapstraction Map</title>
>
> <style>
> #mapstraction
> {
> width: 500px;
> height: 300px;
> }
> </style>
>
> <script
src="http://maps.google.com/maps?file=api&v=2&key=MyGoogleAPIKey"
> type="text/JavaScript"></script>
>
> <script
src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6
> "></script>
>
> <script src="mapstraction.js"></script>
>
> <script type="text/JavaScript">
> var mapstraction;
>
> function initialize_mapstraction()
> {
> // Create a map object
> // **** Toggle second parameter between: google/microsoft ****
> mapstraction = new Mapstraction(''mapstraction'',
''microsoft'');
> // Create a latitude/longitude point
> var ll = new LatLonPoint(37.780764,-122.395592);
> // Display map centered on above point, zoomed to show most of San
> Francisco
> mapstraction.setCenterAndZoom(ll, 18);
>
> // Create map marker from above point
> var marker = new Marker(ll);
>
> // Include text in info bubble shown when marker is clicked
>
marker.setInfoBubble("<h2><strong>Wired.com</strong></h2><p>Home
of
> Monkeys</p>");
>
> // Add marker to the map
> mapstraction.addMarker(marker);
>
> }
> </script>
>
>
> </head>
> <body onload="initialize_mapstraction()">
>
> <h1>My Mapstraction Map</h1>
>
> <div id="mapstraction"></div>
>
> <button
onClick="mapstraction.swap(mapstraction,''google'')">Switch
to
> Google</button>
>
> </body>
> </html>
>
>
>
> .
>
> _______________________________________________
> Mapstraction mailing list
> Mapstraction at lists.mapstraction.com
> http://lists.mapstraction.com/listinfo.cgi/mapstraction-mapstraction.com
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL:
<http://lists.mapstraction.com/pipermail/mapstraction-mapstraction.com/attachments/20110222/1b13f60b/attachment.htm>