public/javascripts/map.js

   1 var epsg4326 = new OpenLayers.Projection("EPSG:4326");
   2 var map;
   3 var markers;
   4 var vectors;
   5 var popup;
   6
   7 var nonamekeys = {
   8    'openstreetmap.org': '2f59745a6b525b4ebdb100891d5b6711',
   9    'www.openstreetmap.org': 'fd093e52f0965d46bb1c6c6281022199',
  10    'openstreetmap.com': '4c60e7f5f31c576a9bb8da71c8d61152',
  11    'www.openstreetmap.com': '142f25a0770a51a9a400b3513834a199',
  12    'openstreetmap.net': '687c58fd1d715596bfc94abe653d8ac0',
  13    'www.openstreetmap.net': '0bd1654141c85d30b9c2ccdb5302f2e4'
  14 };
  15
  16 OpenLayers._getScriptLocation = function () {
  17   // Should really have this file as an erb, so that this can return
  18   // the real rails root
  19    return "/openlayers/";
  20 }
  21
  22 function createMap(divName, options) {
  23    options = options || {};
  24
  25    map = new OpenLayers.Map(divName, {
  26       controls: options.controls || [
  27          new OpenLayers.Control.ArgParser(),
  28          new OpenLayers.Control.Attribution(),
  29          new OpenLayers.Control.LayerSwitcher(),
  30          new OpenLayers.Control.Navigation(),
  31          new OpenLayers.Control.PanZoomBar()
  32       ],
  33       units: "m",
  34       maxResolution: 156543.0339,
  35       numZoomLevels: 20,
  36       displayProjection: new OpenLayers.Projection("EPSG:4326")
  37    });
  38
  39    var mapnik = new OpenLayers.Layer.OSM.Mapnik(rails_i18n["javascripts.map.base.mapnik"], {
  40       displayOutsideMaxExtent: true,
  41       wrapDateLine: true
  42    });
  43    map.addLayer(mapnik);
  44
  45    var osmarender = new OpenLayers.Layer.OSM.Osmarender(rails_i18n["javascripts.map.base.osmarender"], {
  46       displayOutsideMaxExtent: true,
  47       wrapDateLine: true
  48    });
  49    map.addLayer(osmarender);
  50
  51    var cyclemap = new OpenLayers.Layer.OSM.CycleMap(rails_i18n["javascripts.map.base.cycle_map"], {
  52       displayOutsideMaxExtent: true,
  53       wrapDateLine: true
  54    });
  55    map.addLayer(cyclemap);
  56
  57    var nonamekey = nonamekeys[document.domain];
  58    var noname = new OpenLayers.Layer.OSM(rails_i18n["javascripts.map.base.noname"], [
  59       "http://a.tile.cloudmade.com/" + nonamekey + "/3/256/${z}/${x}/${y}.png",
  60       "http://b.tile.cloudmade.com/" + nonamekey + "/3/256/${z}/${x}/${y}.png",
  61       "http://c.tile.cloudmade.com/" + nonamekey + "/3/256/${z}/${x}/${y}.png"
  62    ], {
  63       displayOutsideMaxExtent: true,
  64       wrapDateLine: true,
  65       numZoomLevels: 19
  66    });
  67    map.addLayer(noname);
  68
  69    var maplint = new OpenLayers.Layer.OSM.Maplint(rails_i18n["javascripts.map.overlays.maplint"], {
  70       displayOutsideMaxExtent: true,
  71       wrapDateLine: true
  72    });
  73    map.addLayer(maplint);
  74
  75    var numZoomLevels = Math.max(mapnik.numZoomLevels, osmarender.numZoomLevels);
  76
  77    markers = new OpenLayers.Layer.Markers("Markers", {
  78       displayInLayerSwitcher: false,
  79       numZoomLevels: numZoomLevels,
  80       maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508),
  81       maxResolution: 156543,
  82       units: "m",
  83       projection: "EPSG:900913"
  84    });
  85    map.addLayer(markers);
  86
  87    return map;
  88 }
  89
  90 function getArrowIcon() {
  91    var size = new OpenLayers.Size(25, 22);
  92    var offset = new OpenLayers.Pixel(-30, -27);
  93    var icon = new OpenLayers.Icon("/images/arrow.png", size, offset);
  94
  95    return icon;
  96 }
  97
  98 function addMarkerToMap(position, icon, description) {
  99    var marker = new OpenLayers.Marker(position.clone().transform(epsg4326, map.getProjectionObject()), icon);
 100
 101    markers.addMarker(marker);
 102
 103    if (description) {
 104       marker.events.register("click", marker, function() { openMapPopup(marker, description) });
 105    }
 106
 107    return marker;
 108 }
 109
 110 function addObjectToMap(url, zoom, callback) {
 111    var layer = new OpenLayers.Layer.GML("Objects", url, {
 112       format: OpenLayers.Format.OSM,
 113       style: {
 114           strokeColor: "blue",
 115           strokeWidth: 3,
 116           strokeOpacity: 0.5,
 117           fillOpacity: 0.2,
 118           fillColor: "lightblue",
 119           pointRadius: 6
 120       },
 121       projection: new OpenLayers.Projection("EPSG:4326"),
 122       displayInLayerSwitcher: false
 123    });
 124
 125    layer.events.register("loadend", layer, function() {
 126       var extent;
 127
 128       if (this.features.length) {
 129          extent = this.features[0].geometry.getBounds();
 130
 131          for (var i = 1; i < this.features.length; i++) {
 132             extent.extend(this.features[i].geometry.getBounds());
 133          }
 134
 135          if (zoom) {
 136             if (extent) {
 137                this.map.zoomToExtent(extent);
 138             } else {
 139                this.map.zoomToMaxExtent();
 140             }
 141          }
 142       }
 143
 144       if (callback) {
 145          callback(extent);
 146       }
 147    });
 148
 149    map.addLayer(layer);
 150
 151    layer.loadGML();
 152 }
 153
 154 function addBoxToMap(boxbounds) {
 155    if (!vectors) {
 156      // Be aware that IE requires Vector layers be initialised on page load, and not under deferred script conditions
 157      vectors = new OpenLayers.Layer.Vector("Boxes", {
 158         displayInLayerSwitcher: false
 159      });
 160      map.addLayer(vectors);
 161    }
 162    var geometry = boxbounds.toGeometry().transform(epsg4326, map.getProjectionObject());
 163    var box = new OpenLayers.Feature.Vector(geometry, {}, {
 164       strokeWidth: 2,
 165       strokeColor: '#ee9900',
 166       fillOpacity: 0
 167    });
 168
 169    vectors.addFeatures(box);
 170
 171    return box;
 172 }
 173
 174 function openMapPopup(marker, description) {
 175    closeMapPopup();
 176
 177    popup = new OpenLayers.Popup.AnchoredBubble("popup", marker.lonlat, null,
 178                                                description, marker.icon, true);
 179    popup.setBackgroundColor("#E3FFC5");
 180    popup.autoSize = true;
 181    map.addPopup(popup);
 182
 183    return popup;
 184 }
 185
 186 function closeMapPopup() {
 187    if (popup) {
 188       map.removePopup(popup);
 189       delete popup;
 190    }
 191 }
 192
 193 function removeMarkerFromMap(marker){
 194    markers.removeMarker(marker);
 195 }
 196
 197 function removeBoxFromMap(box){
 198    vectors.removeFeature(box);
 199 }
 200
 201 function getMapCenter(center, zoom) {
 202    return map.getCenter().clone().transform(map.getProjectionObject(), epsg4326);
 203 }
 204
 205 function setMapCenter(center, zoom) {
 206    zoom = parseInt(zoom);
 207    var numzoom = map.getNumZoomLevels();
 208    if (zoom >= numzoom) zoom = numzoom - 1;
 209    map.setCenter(center.clone().transform(epsg4326, map.getProjectionObject()), zoom);
 210 }
 211
 212 function setMapExtent(extent) {
 213    map.zoomToExtent(extent.clone().transform(epsg4326, map.getProjectionObject()));
 214 }
 215
 216 function getMapExtent() {
 217    return map.getExtent().clone().transform(map.getProjectionObject(), epsg4326);
 218 }
 219
 220 function getEventPosition(event) {
 221    return map.getLonLatFromViewPortPx(event.xy).clone().transform(map.getProjectionObject(), epsg4326);
 222 }
 223
 224 function getMapLayers() {
 225    var layerConfig = "";
 226
 227    for (var layers = map.getLayersBy("isBaseLayer", true), i = 0; i < layers.length; i++) {
 228       layerConfig += layers[i] == map.baseLayer ? "B" : "0";
 229    }
 230
 231    for (var layers = map.getLayersBy("isBaseLayer", false), i = 0; i < layers.length; i++) {
 232       layerConfig += layers[i].getVisibility() ? "T" : "F";
 233    }
 234
 235    return layerConfig;
 236 }
 237
 238 function setMapLayers(layerConfig) {
 239    var l = 0;
 240
 241    for (var layers = map.getLayersBy("isBaseLayer", true), i = 0; i < layers.length; i++) {
 242       var c = layerConfig.charAt(l++);
 243
 244       if (c == "B") {
 245          map.setBaseLayer(layers[i]);
 246       }
 247    }
 248
 249    while (layerConfig.charAt(l) == "B" || layerConfig.charAt(l) == "0") {
 250       l++;
 251    }
 252
 253    for (var layers = map.getLayersBy("isBaseLayer", false), i = 0; i < layers.length; i++) {
 254       var c = layerConfig.charAt(l++);
 255
 256       if (c == "T") {
 257          layers[i].setVisibility(true);
 258       } else if(c == "F") {
 259          layers[i].setVisibility(false);
 260       }
 261    }
 262 }
 263
 264 function scaleToZoom(scale) {
 265    return Math.log(360.0/(scale * 512.0)) / Math.log(2.0);
 266 }