samples/boilerplateHTML/mapstraction/mapstraction-cloudmade.html @@ -26,7 +26,7 @@ <link rel="stylesheet" href="codemirror/css/docs.css" media="screen,projection" type="text/css">  - <title>Mapstraction API Sandbox</title> + <title>Mapstraction v2 API Sandbox</title> <script src="codemirror/js/prod_codemirrorz_513eeb9927a9d790c360886e3bb09a43.js" type="text/javascript" charset="utf-8"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery-ui-packed.js" type="text/javascript" charset="utf-8"></script> @@ -75,7 +75,7 @@ </td> <td valign=middle style="width: 60%"> - <h1 id="header">Mapstraction API Sandbox</h1> + <h1 id="header">Mapstraction v2 API Sandbox</h1> </td> <td style="width:80%;"> </td> </tr> index.html @@ -15,17 +15,11 @@ var tempJSON = [ "category":"Mapstraction API-Providers", "samples":[ {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-google.html", "files":["samples/js/mapstraction/mapstraction-google.js"], "sampleName":"Google", "tags": "", "providers": "google"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-google.html", "files":["samples/js/mapstraction/mapstraction-osm.js"], "sampleName":"OpenStreetMap", "tags": "", "providers": "google"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-yahoo.html", "files":["samples/js/mapstraction/mapstraction-yahoo.js"], "sampleName":"Yahoo", "tags": "", "providers": "yahoo"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-microsoft.html", "files":["samples/js/mapstraction/mapstraction-microsoft.js"], "sampleName":"Microsoft", "tags": "", "providers": "microsoft"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-mapquest.html", "files":["samples/js/mapstraction/mapstraction-mapquest.js"], "sampleName":"MapQuest", "tags": "", "providers": "mapquest"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-openlayers.html", "files":["samples/js/mapstraction/mapstraction-openlayers.js"], "sampleName":"OpenLayers", "tags": "", "providers": "openlayers"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-google.html", "files":["samples/js/mapstraction/mapstraction-osm.js"], "sampleName":"OpenStreetMap", "tags": "", "providers": "google"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-multimap.html", "files":["samples/js/mapstraction/mapstraction-multimap.js"], "sampleName":"MultiMap", "tags": "", "providers": "multimap"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-map24.html", "files":["samples/js/mapstraction/mapstraction-map24.js"], "sampleName":"Map24", "tags": "", "providers": "map24"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-freeearth.html", "files":["samples/js/mapstraction/mapstraction-freeearth.js"], "sampleName":"FreeEarth", "tags": "", "providers": "freeearth"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-viamichelin.html", "files":["samples/js/mapstraction/mapstraction-viamichelin.js"], "sampleName":"ViaMichelin", "tags": "", "providers": "viamichelin"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-openspace.html", "files":["samples/js/mapstraction/mapstraction-openspace.js"], "sampleName":"OpenSpace", "tags": "", "providers": "openspace"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-cloudmade.html", "files":["samples/js/mapstraction/mapstraction-cloudmade.js"], "sampleName":"CloudMade", "tags": "", "providers": "cloudmade"} + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-cloudmade.html", "files":["samples/js/mapstraction/mapstraction-cloudmade.js"], "sampleName":"CloudMade", "tags": "", "providers": ""} ], "docsUrl": "http://mapstraction.com/doc/" }, @@ -47,7 +41,7 @@ var tempJSON = [ {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-google.html", "files":["samples/js/mapstraction/mapstraction-json.js"], "sampleName":"JSON", "tags": "", "providers": "google"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-geocode.html", "files":["samples/js/mapstraction/mapstraction-csv.js"], "sampleName":"CSV", "tags": "", "providers": "google"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-openlayers.html", "files":["samples/js/mapstraction/mapstraction-polylines.js"], "sampleName":"Polylines", "tags": "", "providers": "openlayers"}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-yahoo.html", "files":["samples/js/mapstraction/mapstraction-overlay.js"], "sampleName":"Image Overlay", "tags": "", "providers": "google"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-google.html", "files":["samples/js/mapstraction/mapstraction-overlay.js"], "sampleName":"Image Overlay", "tags": "", "providers": "google"}, {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-tiles.html", "files":["samples/js/mapstraction/mapstraction-tiles.js"], "sampleName":"Tiles", "tags": "", "providers": "google"} ], "docsUrl": "http://mapstraction.com/doc/" @@ -67,12 +61,16 @@ var tempJSON = [ {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-openlayers_style.html", "files":["samples/js/mapstraction/mapstraction-openlayers.js"], "sampleName":"Styling", "tags": "", "providers": "google"} ], "docsUrl": "http://mapstraction.com/doc/" -}, +}, { - "category":"Mapstraction API-mxn", + "category":"Mapstraction v1-Providers", "samples":[ - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-mxn.html", "files":["samples/js/mapstraction/mapstraction-mxn.js"], "sampleName":"Mapstraction v2", "tags": "", "providers": ""}, - {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-geocommons.html", "files":["samples/js/mapstraction/mapstraction-geocommons.js"], "sampleName":"GeoCommons", "tags": "", "providers": ""} + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-mapquest.html", "files":["samples/js/mapstraction/mapstraction-mapquest.js"], "sampleName":"MapQuest", "tags": "", "providers": "mapquest"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-multimap.html", "files":["samples/js/mapstraction/mapstraction-multimap.js"], "sampleName":"MultiMap", "tags": "", "providers": "multimap"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-map24.html", "files":["samples/js/mapstraction/mapstraction-map24.js"], "sampleName":"Map24", "tags": "", "providers": "map24"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-freeearth.html", "files":["samples/js/mapstraction/mapstraction-freeearth.js"], "sampleName":"FreeEarth", "tags": "", "providers": "freeearth"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-viamichelin.html", "files":["samples/js/mapstraction/mapstraction-viamichelin.js"], "sampleName":"ViaMichelin", "tags": "", "providers": "viamichelin"}, + {"boilerplateLoc":"samples/boilerplateHTML/mapstraction/mapstraction-openspace.html", "files":["samples/js/mapstraction/mapstraction-openspace.js"], "sampleName":"OpenSpace", "tags": "", "providers": "openspace"} ], "docsUrl": "http://mapstraction.com/doc/" } samples/TOC/mapstraction_api_samples.js @@ -11,9 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script type="text/javascript" charset="utf-8" src="http://maker.news.geocommons.com/javascripts/embed.js"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.js" type="text/javascript"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.core.js" type="text/javascript"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.geocommons.core.js" type="text/javascript"></script> + <script src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(geocommons)" type="text/javascript"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-geocommons.html @@ -11,7 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key={{ key }}" type="text/javascript"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-google.html @@ -7,7 +7,7 @@ <script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=3.0&appid=MapstractionDemo"></script> <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"></script> <script src="http://openlayers.org/api/OpenLayers.js"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google, yahoo, microsoft, openlayers)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-gymol.html @@ -11,7 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(microsoft)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-microsoft.html @@ -11,9 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key={{ key }}" type="text/javascript"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.js" type="text/javascript"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.core.js" type="text/javascript"></script> - <script src="http://github.com/mapstraction/mxn/raw/a338873f0e4fe4dee97548144092386b0baa3e46/source/mxn.google.core.js" type="text/javascript"></script> + <script src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google)" type="text/javascript"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-mxn.html @@ -11,7 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script src="http://openlayers.org/api/OpenLayers.js"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(openlayers)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-openlayers.html @@ -14,7 +14,7 @@ div.gray .olControlZoomPanel {  top: 14px;  left: 14px; }   div.gray .olControlZoomPanel div {  background-image: url(img/gray/gray_zoom_horiz.png);  height: 18px;  width: 18px; }  div.gray .olControlZoomPanel .olControlZoomInItemInactive {  top: 0px;  left: 25px;  background-position: 18px 0px; }  div.gray .olControlZoomPanel .olControlZoomToMaxExtentItemInactive {  top: 0px;  left: 0px;  background-position: 0px -18px; }  div.gray .olControlZoomPanel .olControlZoomOutItemInactive {  top: 0px;  left: 0px;  background-position: 0px 0px; } </style> <script src="http://openlayers.org/api/OpenLayers.js"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(openlayers)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-openlayers_style.html @@ -16,7 +16,7 @@ </style> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key={{ key }}" type="text/javascript"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google)"></script> <script src="http://mapstraction.appspot.com/lib/prototype.js" type="text/javascript"></script> <script src="http://mapstraction.appspot.com/lib/scriptaculous.js?load=slider" type="text/javascript"></script> <script type="text/javascript"> samples/boilerplateHTML/mapstraction/mapstraction-sliders.html @@ -6,8 +6,8 @@ <script src="http://maps.google.com/maps?file=api&v=2&key={{ key }}" type="text/javascript"></script> <script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=3.0&appid=MapstractionDemo"></script> <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"></script> - <script src="http://btilelog.beta.mapquest.com/tilelog/transaction?transaction=script&key=mjtd%7Clu6t210anh%2Crn%3Do5-labwu&itk=true&v=5.3.0_RC5&ipkg=controls1" type="text/javascript"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script src="http://openlayers.org/api/OpenLayers.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google, yahoo, microsoft, openlayers)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} @@ -24,19 +24,14 @@ </head> <body onload="initialize()" style="font-family: Arial;border: 0 none;"> <div id="google" class="mapstraction"></div> - <div id="multimap" class="mapstraction" style="display:none"></div> + <div id="openlayers" class="mapstraction" style="display:none"></div> <div id="yahoo" class="mapstraction" style="display:none"></div> <div id="microsoft" class="mapstraction" style="display:none"></div> - <div id="freearth" class="mapstraction" style="display:none"></div> - <div id="mapquest" class="mapstraction" style="display:none"></div> - <div id="openstreetmap" class="mapstraction" style="display:none"></div> - <div style="margin-left: 150px; height: 100%; width: 300px;"><div id="mapquest" class="mapstraction" style="display:none;height: 100%; width: 100%;"></div></div> <form action="get"> <input type="radio" name="api" value="google" CHECKED onClick="mapstraction.swap('google','google')"> Google<br> <input type="radio" name="api" value="yahoo" onClick="mapstraction.swap('yahoo','yahoo')"> Yahoo<br> <input type="radio" name="api" value="microsoft" onClick="mapstraction.swap('microsoft','microsoft')"> Microsoft<br> - <input type="radio" name="api" value="openstreetmap" onClick="mapstraction.swap('openstreetmap','openstreetmap')"> OpenStreetMap<br/> - <input type="radio" name="api" value="mapquest" onClick="mapstraction.swap('mapquest','mapquest')"> MapQuest<br/> + <input type="radio" name="api" value="mapquest" onClick="mapstraction.swap('openlayers','openlayers')"> OpenLayers<br/> </form> </body> </html> \ No newline at end of file samples/boilerplateHTML/mapstraction/mapstraction-swap.html @@ -11,7 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key={{ key }}" type="text/javascript"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(google)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-tiles.html @@ -11,7 +11,7 @@ <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Mapstraction API Sample</title> <script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=3.8&appid=MapstractionDemo"></script> - <script type="text/javascript" charset="utf-8" src="http://mapstraction.com/mapstraction-js/mapstraction.js"></script> + <script type="text/javascript" charset="utf-8" src="http://github.com/mapstraction/mxn/raw/master/source/mxn.js?(yahoo)"></script> <script type="text/javascript"> {{ INSERT_JAVASCRIPT_HERE }} samples/boilerplateHTML/mapstraction/mapstraction-yahoo.html @@ -1,5 +1,5 @@ var mapstraction; function initialize() { - mapstraction = new Mapstraction('map_canvas','yahoo'); - mapstraction.setCenterAndZoom(new LatLonPoint(37.75,-122.44), 8); + mapstraction = new mxn.Mapstraction('map_canvas','yahoo'); + mapstraction.setCenterAndZoom(new mxn.LatLonPoint(37.75,-122.44), 8); } samples/js/mapstraction/mapstraction-addmap.js @@ -1,6 +1,6 @@ function initialize() { - var mapstraction = new Mapstraction('map_canvas','google'); - var myPoint = new LatLonPoint(37.404196,-122.008194); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); mapstraction.setCenterAndZoom(myPoint, 9); /* args = { samples/js/mapstraction/mapstraction-controls.js @@ -1,12 +1,12 @@ var marker; var mapstraction; function initialize() { - mapstraction = new Mapstraction('map_canvas','google'); - mapstraction.setCenterAndZoom(new LatLonPoint(37.404196,-122.008194), 7); + mapstraction = new mxn.Mapstraction('map_canvas','google'); + mapstraction.setCenterAndZoom(new mxn.LatLonPoint(37.404196,-122.008194), 7); mapstraction.addEventListener('click', function(p) { - marker = new Marker(p); + marker = new mxn.Marker(p); text = "<p>Lat: " + p.lat + " Lon: " + p.lon + "</p>"; marker.setLabel(text); marker.setInfoBubble(text); samples/js/mapstraction/mapstraction-events.js @@ -1,8 +1,8 @@ var mapstraction; function initialize() { - mapstraction = new Mapstraction('map_canvas', 'google'); - var myPoint = new LatLonPoint(51.387745, -0.50914); + mapstraction = new mxn.Mapstraction('map_canvas', 'google'); + var myPoint = new mxn.LatLonPoint(51.387745, -0.50914); mapstraction.setCenterAndZoom(myPoint, 14); addMarkers( 100 ); @@ -48,8 +48,8 @@ function addMarkers( count ) { var sw = bounds.getSouthWest(); var ne = bounds.getNorthEast(); while ( count-- ) { - var ll = new LatLonPoint( sw.lat + ( ( ne.lat - sw.lat ) * Math.random() ), sw.lon + ( ( ne.lon - sw.lon ) * Math.random() ) ); - var marker = new Marker(ll); + var ll = new mxn.LatLonPoint( sw.lat + ( ( ne.lat - sw.lat ) * Math.random() ), sw.lon + ( ( ne.lon - sw.lon ) * Math.random() ) ); + var marker = new mxn.Marker(ll); var number = Math.round( 86400000 * Math.random() ); var d = new Date(); samples/js/mapstraction/mapstraction-filters.js @@ -1,7 +1,7 @@ function initialize() { - var mapstraction = new Mapstraction('map_canvas','openlayers'); + var mapstraction = new mxn.Mapstraction('map_canvas','openlayers'); - var myPoint = new LatLonPoint(37.4041960114344,-122.008194923401); + var myPoint = new mxn.LatLonPoint(37.4041960114344,-122.008194923401); mapstraction.setCenterAndZoom(myPoint, 3); mapstraction.addControls({zoom: 'large'}); mapstraction.addOverlay("http://api.flickr.com/services/feeds/groups_pool.gne?id=322338@N20&format=rss_200&georss=1"); samples/js/mapstraction/mapstraction-georss.js @@ -1,9 +1,9 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','google'); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +14,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-google.js @@ -1,8 +1,8 @@ var mapstraction; function initialize() { - mapstraction = new Mapstraction('map_canvas','google'); + mapstraction = new mxn.Mapstraction('map_canvas','google'); - var myPoint = new LatLonPoint(37.4041960114344,-122.008194923401); + var myPoint = new mxn.LatLonPoint(37.4041960114344,-122.008194923401); mapstraction.setCenterAndZoom(myPoint, 3); mapstraction.addControls({zoom: 'large'}); samples/js/mapstraction/mapstraction-json.js @@ -1,7 +1,7 @@ function initialize() { - var mapstraction = new Mapstraction('map_canvas','google'); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); - var myPoint = new LatLonPoint(37.4041960114344,-122.008194923401); + var myPoint = new mxn.LatLonPoint(37.4041960114344,-122.008194923401); mapstraction.setCenterAndZoom(myPoint, 4); mapstraction.addControls({zoom: 'large'}); mapstraction.addOverlay("http://maker.geocommons.com/maps/5059/overlays/0.kml"); samples/js/mapstraction/mapstraction-kml.js @@ -1,13 +1,13 @@ var mapstraction; function initialize() { - mapstraction = new Mapstraction('map_canvas','google'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction = new mxn.Mapstraction('map_canvas','google'); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); advancedMarker(); mapstraction.autoCenterAndZoom(); } function advancedMarker() { - mapstraction.addMarkerWithData(new Marker( new LatLonPoint(47.4004,153.1435)),{ + mapstraction.addMarkerWithData(new mxn.Marker( new mxn.LatLonPoint(47.4004,153.1435)),{ infoBubble : "Advanced Marker", label : "tooltip", date : "new Date()", samples/js/mapstraction/mapstraction-marker.js @@ -1,9 +1,9 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','microsoft'); + var mapstraction = new mxn.Mapstraction('map_canvas','microsoft'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +14,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-microsoft.js @@ -1,9 +1,9 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','openlayers'); + var mapstraction = new mxn.Mapstraction('map_canvas','openlayers'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +14,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-openlayers.js @@ -1,9 +1,12 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','openstreetmap'); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); + + // Add OpenStreetMap base layer + mapstraction.addTileLayer("http://tile.openstreetmap.org/{Z}/{X}/{Y}.png", 1.0, "OSM", 1, 19, false); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +17,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-osm.js @@ -1,9 +1,9 @@ function initialize() { - var mapstraction = new Mapstraction('map_canvas','yahoo'); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); - var myPoint = new LatLonPoint(18.47, -69.9); + var myPoint = new mxn.LatLonPoint(18.47, -69.9); mapstraction.setCenterAndZoom(myPoint, 11); - mapstraction.setMapType(Mapstraction.SATELLITE); + mapstraction.setMapType(mxn.Mapstraction.SATELLITE); mapstraction.addImageOverlay("over","http://mapstraction.com/images/santodomingo.png",50,-70.01544, 18.39777, -69.80567, 18.563517); mapstraction.addSmallControls(); } \ No newline at end of file samples/js/mapstraction/mapstraction-overlay.js @@ -1,14 +1,13 @@ function poly(map) { - map.setCenterAndZoom(new LatLonPoint(37.78,-122.395033836365), 12); - map.setMapType(Mapstraction.ROAD); + map.setCenterAndZoom(new mxn.LatLonPoint(37.78,-122.395033836365), 12); // create a polygon object - var myPoly = new Polyline([new LatLonPoint(37.7945928242851,-122.395033836365), new LatLonPoint(37.7938467508748,-122.393960952759), new LatLonPoint(37.7945928242851,-122.39275932312), new LatLonPoint(37.789505810689,-122.387609481812), new LatLonPoint(37.7782792282611,-122.387351989746), new LatLonPoint(37.7768545853105,-122.390570640564), new LatLonPoint(37.7690524823224,-122.397179603577), new LatLonPoint(37.7668813159428,-122.394347190857), new LatLonPoint(37.7658635597592,-122.407650947571), new LatLonPoint(37.7689167862912,-122.408037185669), new LatLonPoint(37.7765493011063,-122.417650222778), new LatLonPoint(37.7945928242851,-122.395033836365)]); + var myPoly = new mxn.Polyline([new mxn.LatLonPoint(37.7945928242851,-122.395033836365), new mxn.LatLonPoint(37.7938467508748,-122.393960952759), new mxn.LatLonPoint(37.7945928242851,-122.39275932312), new mxn.LatLonPoint(37.789505810689,-122.387609481812), new mxn.LatLonPoint(37.7782792282611,-122.387351989746), new mxn.LatLonPoint(37.7768545853105,-122.390570640564), new mxn.LatLonPoint(37.7690524823224,-122.397179603577), new mxn.LatLonPoint(37.7668813159428,-122.394347190857), new mxn.LatLonPoint(37.7658635597592,-122.407650947571), new mxn.LatLonPoint(37.7689167862912,-122.408037185669), new mxn.LatLonPoint(37.7765493011063,-122.417650222778), new mxn.LatLonPoint(37.7945928242851,-122.395033836365)]); map.addPolyline(myPoly); } function initialize() { - var gmapstraction = new Mapstraction('map_canvas','openlayers'); + var gmapstraction = new mxn.Mapstraction('map_canvas','openlayers'); poly(gmapstraction); } \ No newline at end of file samples/js/mapstraction/mapstraction-polylines.js @@ -1,6 +1,6 @@ function initialize() { - var mapstraction = new Mapstraction('map_canvas','google'); - mapstraction.setCenterAndZoom(new LatLonPoint(37.404196,-122.008194), 9); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); + mapstraction.setCenterAndZoom(new mxn.LatLonPoint(37.404196,-122.008194), 9); // Use Google's Traffic Overlay var trafficOptions = {incidents:true}; samples/js/mapstraction/mapstraction-provider_specific.js @@ -4,11 +4,11 @@ function initialize() // hide the right-hand filter handle $('handle2').hide(); - mapstraction = new Mapstraction('map_canvas', 'google'); + mapstraction = new mxn.Mapstraction('map_canvas', 'google'); mapstraction.enableScrollWheelZoom(); - myPoint = new LatLonPoint(52.250873, 0.110292); + myPoint = new mxn.LatLonPoint(52.250873, 0.110292); mapstraction.setCenterAndZoom(myPoint, 12); - centerRadius = new Radius(myPoint, 20); + centerRadius = new mxn.Radius(myPoint, 20); addMarkers(50); addSlider(); sliderChanged(1); @@ -19,9 +19,9 @@ function addMarkers(count) { var sw = bounds.getSouthWest(); var ne = bounds.getNorthEast(); while ( count-- ) { - var ll = new LatLonPoint( sw.lat + ( ( ne.lat - sw.lat ) * Math.random() ), sw.lon + ( ( ne.lon - sw.lon ) * Math.random() ) ); - var marker = new Marker(ll); - var distance = mxn.fn.KMToMiles(marker.location.distance(myPoint)); + var ll = new mxn.LatLonPoint( sw.lat + ( ( ne.lat - sw.lat ) * Math.random() ), sw.lon + ( ( ne.lon - sw.lon ) * Math.random() ) ); + var marker = new mxn.Marker(ll); + var distance = mxn.util.KMToMiles(marker.location.distance(myPoint)); var el = document.createElement('strong'); el.appendChild( document.createTextNode('Distance: ' + distance.toFixed(2) + ' Mile(s)')); marker.setInfoBubble(el); @@ -44,7 +44,7 @@ function addSlider() { function sliderChanged(radius) { mapstraction.removeAllPolylines(); mapstraction.removeAllFilters(); - mapstraction.addPolygon(centerRadius.getPolyline(mxn.fn.milesToKM(radius), '#00F')); + mapstraction.addPolyline(centerRadius.getPolyline(mxn.util.milesToKM(radius), '#00F')); mapstraction.addFilter('distance', 'le', radius); var selectedCount = mapstraction.doFilter(); var tw = document.getElementById( 'timeWindow' ); samples/js/mapstraction/mapstraction-radius.js @@ -1,9 +1,9 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','google'); + var mapstraction = new mxn.Mapstraction('map_canvas','google'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +14,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-simple.js @@ -1,9 +1,9 @@ var mapstraction; function initialize() { - mapstraction = new Mapstraction('google','google'); - var myPoint = new LatLonPoint(38.8971, -77.070857); + mapstraction = new mxn.Mapstraction('google','google'); + var myPoint = new mxn.LatLonPoint(38.8971, -77.070857); mapstraction.setCenterAndZoom(myPoint, 13); - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); var text = "Swapping with Mapstraction"; my_marker.setInfoBubble(text); mapstraction.addMarker(my_marker); samples/js/mapstraction/mapstraction-swap.js @@ -1,16 +1,17 @@ var mapstraction; -var maptiles = [ "http://oakland-1950s.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg", -"http://oakland-1912.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg", -"http://oakland-1877.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg"]; +var maptiles = [ ["http://oakland-1950s.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg", "Oakland 1950"], +["http://oakland-1912.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg", "Oakland 1912"], +["http://oakland-1877.s3.amazonaws.com/{Z}-r{Y}-c{X}.jpg", "Oakland 1877"]]; function initialize() { - mapstraction = new Mapstraction('map_canvas','google'); - var myPoint = new LatLonPoint(37.804656, -122.263606); + mapstraction = new mxn.Mapstraction('map_canvas','google'); + var myPoint = new mxn.LatLonPoint(37.804656, -122.263606); // display the map centered on a latitude and longitude (Google zoom levels) - mapstraction.setCenterAndZoom(myPoint, 11); - mapstraction.setMapType(Mapstraction.SATELLITE); + mapstraction.setCenterAndZoom(myPoint, 12); + mapstraction.setMapType(mxn.Mapstraction.SATELLITE); mapstraction.addSmallControls(); + mapstraction.addMapTypeControls(); for(var t=0;t<maptiles.length;t++) { - mapstraction.addTileLayer(maptiles[t], 0.6); + mapstraction.addTileLayer(maptiles[t][0], 0.6, maptiles[t][1]); } } samples/js/mapstraction/mapstraction-tiles.js @@ -1,9 +1,9 @@ function initialize() { // initialise the map with your choice of API - var mapstraction = new Mapstraction('map_canvas','yahoo'); + var mapstraction = new mxn.Mapstraction('map_canvas','yahoo'); // create a lat/lon object - var myPoint = new LatLonPoint(37.404196,-122.008194); + var myPoint = new mxn.LatLonPoint(37.404196,-122.008194); // display the map centered on a latitude and longitude (Google zoom levels) mapstraction.setCenterAndZoom(myPoint, 9); @@ -14,11 +14,11 @@ function initialize() { map_type: true }); // create a marker positioned at a lat/lon - my_marker = new Marker(myPoint); + my_marker = new mxn.Marker(myPoint); my_marker.setIcon('http://mapstraction.com/icon.gif'); - mapstraction.addMarker( new Marker( new LatLonPoint(37.75,-122.44))); + mapstraction.addMarker( new mxn.Marker( new mxn.LatLonPoint(37.75,-122.44))); // add a label to the marker my_marker.setLabel("<blink>Hello!</blink>"); samples/js/mapstraction/mapstraction-yahoo.js 206fd1a39d7d25870129f54be2dafe88c86ef6de Andrew Turner andrew@highearthorbit.com http://github.com/mapstraction/sandbox/commit/20b76294c20a645da79a87f49141b356825613ac 20b76294c20a645da79a87f49141b356825613ac

2009-10-03T11:12:45-07:00

Moved most examples over to Mapstraction v2 support cde18cf0d40d4a42a85d17bb87ddc742f2d4f1c2 Andrew Turner andrew@highearthorbit.com