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