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