app/assets/javascripts/map.js.erb

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