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