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