Mapstraction

Shows maps from OpenStreetMap, Yahoo!, Google and Microsoft set up using exactly the same code. Changes to the Yahoo! map will be passed on to the others.

      function londonJavascriptNight(map) {
        // create a lat/lon object
        var myPoint = new LatLonPoint(51.520832, -0.140133);
        // display the map centered on a latitude and longitude (Google zoom levels)
	map.setCenterAndZoom(myPoint, 12);

        // create a marker positioned at a lat/lon 
        var marker = new Marker(myPoint);
        // add info bubble to the marker
        marker.setInfoBubble("Hello London!");
      
        // display marker 
	map.addMarker(marker);
      }

      var gmapstraction = new Mapstraction('gmap','google');
      londonJavascriptNight(gmapstraction);
      var ymapstraction = new Mapstraction('ymap','yahoo');
      londonJavascriptNight(ymapstraction);
      var mmapstraction = new Mapstraction('mmap','microsoft');
      londonJavascriptNight(mmapstraction);
      var osmapstraction = new Mapstraction('osmap','openstreetmap');
      londonJavascriptNight(osmapstraction);

      // synchronise center of gmap and mmap with ymap
      var ycsync = function() {
        var center = ymapstraction.getCenter();
	gmapstraction.setCenter(center);
	mmapstraction.setCenter(center);
	osmapstraction.setCenter(center);
	center = undefined;
      };
      // synchronise zoom of gmap and mmap with ymap
      var yzsync = function() {
        var zoom = ymapstraction.getZoom();
        gmapstraction.setZoom(zoom);
	mmapstraction.setZoom(zoom);
	osmapstraction.setZoom(zoom);
	zoom = undefined;
      };

      var ymap = ymapstraction.getMap();
      YEvent.Capture(ymap, "onPan", ycsync);
      YEvent.Capture(ymap, "endPan", ycsync);
      YEvent.Capture(ymap, "endAutoPan", ycsync);
      YEvent.Capture(ymap, "changeZoom", yzsync);