-var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+// Leaflet extensions
+L.LatLngBounds.include({
+ getSouthLat: function () {
+ return this._southWest.lat;
+ },
+
+ getWestLng: function () {
+ return this._southWest.lng;
+ },
+
+ getNorthLat: function () {
+ return this._northEast.lat;
+ },
+
+ getEastLng: function () {
+ return this._northEast.lng;
+ },
+
+ toBBOX: function () {
+ var decimal = 6;
+ var mult = Math.pow(10, decimal);
+ var xmin = Math.round(this.getWestLng() * mult) / mult;
+ var ymin = Math.round(this.getSouthLat() * mult) / mult;
+ var xmax = Math.round(this.getEastLng() * mult) / mult;
+ var ymax = Math.round(this.getNorthLat() * mult) / mult;
+ return xmin + "," + ymin + "," + xmax + "," + ymax;
+ },
+
+ getSize: function () {
+ return (this._northEast.lat - this._southWest.lat) *
+ (this._northEast.lng - this._southWest.lng);
+ }
+});
+
+L.Bounds.include({
+ getWidth: function () {
+ return this.max.x - this.min.x;
+ },
+
+ getHeight: function () {
+ return this.max.y - this.min.y;
+ }
+});
+
+L.Icon.Default.imagePath = <%= "#{asset_prefix}/images".to_json %>;
+
var map;
-var markers;
-var vectors;
-var popup;
+
+var layers = [
+ {
+ klass: L.OSM.Mapnik,
+ attribution: "",
+ keyid: "mapnik",
+ layerCode: "M",
+ name: I18n.t("javascripts.map.base.standard")
+ },
+ {
+ klass: L.OSM.CycleMap,
+ attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
+ keyid: "cyclemap",
+ layerCode: "C",
+ name: I18n.t("javascripts.map.base.cycle_map")
+ },
+ {
+ klass: L.OSM.TransportMap,
+ attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
+ keyid: "transportmap",
+ layerCode: "T",
+ name: I18n.t("javascripts.map.base.transport_map")
+ },
+ {
+ klass: L.OSM.MapQuestOpen,
+ 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'>",
+ keyid: "mapquest",
+ layerCode: "Q",
+ name: I18n.t("javascripts.map.base.mapquest")
+ }
+];
function createMap(divName, options) {
- options = options || {};
-
- map = new OpenLayers.Map(divName, {
- controls: options.controls || [
- new OpenLayers.Control.ArgParser(),
- new OpenLayers.Control.Attribution(),
- new OpenLayers.Control.LayerSwitcher(),
- new OpenLayers.Control.Navigation(),
- new OpenLayers.Control.PanZoom(),
- new OpenLayers.Control.PanZoomBar(),
- new OpenLayers.Control.ScaleLine({geodesic: true})
- ],
- units: "m",
- maxResolution: 156543.0339,
- numZoomLevels: 20,
- displayProjection: new OpenLayers.Projection("EPSG:4326")
- });
-
- var mapnik = new OpenLayers.Layer.OSM.Mapnik(i18n("javascripts.map.base.mapnik"), {
- attribution: "",
- keyid: "mapnik",
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- layerCode: "M"
- });
- map.addLayer(mapnik);
-
- var osmarender = new OpenLayers.Layer.OSM.Osmarender(i18n("javascripts.map.base.osmarender"), {
- attribution: "",
- keyid: "osmarender",
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- layerCode: "O"
- });
- map.addLayer(osmarender);
-
- var cyclemap = new OpenLayers.Layer.OSM.CycleMap(i18n("javascripts.map.base.cycle_map"), {
- attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
- keyid: "cyclemap",
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- layerCode: "C"
- });
- map.addLayer(cyclemap);
-
- var transportmap = new OpenLayers.Layer.OSM.TransportMap(i18n("javascripts.map.base.transport_map"), {
- attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
- keyid: "transportmap",
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- layerCode: "T"
- });
- map.addLayer(transportmap);
-
- var mapquest = new OpenLayers.Layer.OSM(i18n("javascripts.map.base.mapquest"), [
- "http://otile1.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
- "http://otile2.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
- "http://otile3.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
- "http://otile4.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png"
- ], {
- 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'>",
- keyid: "mapquest",
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- numZoomLevels: 19,
- layerCode: "Q"
- });
- map.addLayer(mapquest);
-
- var numZoomLevels = Math.max(mapnik.numZoomLevels, osmarender.numZoomLevels);
-
- markers = new OpenLayers.Layer.Markers("Markers", {
- displayInLayerSwitcher: false,
- numZoomLevels: numZoomLevels,
- maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508),
- maxResolution: 156543,
- units: "m",
- projection: "EPSG:900913"
- });
- map.addLayer(markers);
-
- return map;
-}
+ options = $.extend({zoomControl: true, panZoomControl: true, layerControl: true}, options);
-function getArrowIcon() {
- var size = new OpenLayers.Size(25, 22);
- var offset = new OpenLayers.Pixel(-30, -27);
- var icon = new OpenLayers.Icon("<%= asset_path 'arrow.png' %>", size, offset);
+ map = L.map(divName, $.extend({}, options, {panControl: false, zoomsliderControl: false, maxZoom: 18}));
- return icon;
-}
+ if (map.attributionControl) {
+ map.attributionControl.setPrefix('');
+ }
+
+ if (options.panZoomControl) {
+ new L.Control.Pan().addTo(map);
+ new L.Control.Zoomslider({stepHeight: 7}).addTo(map);
+ }
-function addMarkerToMap(position, icon, description) {
- var marker = new OpenLayers.Marker(position.clone().transform(epsg4326, map.getProjectionObject()), icon);
+ var layersControl = L.control.layers();
- markers.addMarker(marker);
+ if (options.layerControl) {
+ layersControl.addTo(map);
+ map.layersControl = layersControl;
+ }
- if (description) {
- marker.events.register("mouseover", marker, function() { openMapPopup(marker, description) });
- }
+ for (var i = 0; i < layers.length; i++) {
+ layers[i].layer = new (layers[i].klass)(layers[i]);
+ layersControl.addBaseLayer(layers[i].layer, layers[i].name);
+ }
- return marker;
+ layers[0].layer.addTo(map);
+
+ $("#" + divName).on("resized", function () {
+ map.invalidateSize();
+ });
+
+ return map;
}
-function addObjectToMap(url, zoom, callback) {
- var layer = new OpenLayers.Layer.GML("Objects", url, {
- format: OpenLayers.Format.OSM,
- style: {
+function getUserIcon(url) {
+ return L.icon({
+ iconUrl: url || <%= asset_path('marker-red.png').to_json %>,
+ iconSize: [25, 41],
+ iconAnchor: [12, 41],
+ popupAnchor: [1, -34],
+ shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+ shadowSize: [41, 41]
+ });
+}
+
+function addObjectToMap(object, zoom, callback) {
+ $.ajax({
+ url: OSM.apiUrl(object),
+ dataType: "xml",
+ success: function (xml) {
+ var layer = new L.OSM.DataLayer(xml, {
+ style: {
strokeColor: "blue",
strokeWidth: 3,
strokeOpacity: 0.5,
fillOpacity: 0.2,
fillColor: "lightblue",
pointRadius: 6
- },
- projection: new OpenLayers.Projection("EPSG:4326"),
- displayInLayerSwitcher: false
- });
-
- layer.events.register("loadend", layer, function() {
- var extent;
-
- if (this.features.length) {
- extent = this.features[0].geometry.getBounds();
-
- for (var i = 1; i < this.features.length; i++) {
- extent.extend(this.features[i].geometry.getBounds());
- }
-
- if (zoom) {
- if (extent) {
- this.map.zoomToExtent(extent);
- } else {
- this.map.zoomToMaxExtent();
- }
- }
+ }
+ });
+
+ var bounds = layer.getBounds();
+
+ if (zoom) {
+ map.fitBounds(bounds);
}
if (callback) {
- callback(extent);
+ callback(bounds);
}
- });
-
- map.addLayer(layer);
-
- layer.loadGML();
-}
-
-function addBoxToMap(boxbounds, id, outline) {
- if (!vectors) {
- // Be aware that IE requires Vector layers be initialised on page load, and not under deferred script conditions
- vectors = new OpenLayers.Layer.Vector("Boxes", {
- displayInLayerSwitcher: false
- });
- map.addLayer(vectors);
- }
- var geometry;
- if (outline) {
- vertices = boxbounds.toGeometry().getVertices();
- vertices.push(new OpenLayers.Geometry.Point(vertices[0].x, vertices[0].y));
- geometry = new OpenLayers.Geometry.LineString(vertices).transform(epsg4326, map.getProjectionObject());
- } else {
- geometry = boxbounds.toGeometry().transform(epsg4326, map.getProjectionObject());
- }
- var box = new OpenLayers.Feature.Vector(geometry, {}, {
- strokeWidth: 2,
- strokeColor: '#ee9900',
- fillOpacity: 0
- });
- box.fid = id;
-
- vectors.addFeatures(box);
-
- return box;
-}
-
-function openMapPopup(marker, description) {
- closeMapPopup();
-
- popup = new OpenLayers.Popup.FramedCloud("popup", marker.lonlat, null,
- description, marker.icon, true);
- popup.setBackgroundColor("#E3FFC5");
- map.addPopup(popup);
-
- return popup;
-}
-
-function closeMapPopup() {
- if (popup) {
- map.removePopup(popup);
- delete popup;
- }
-}
-
-function removeMarkerFromMap(marker){
- markers.removeMarker(marker);
-}
-function removeBoxFromMap(box){
- vectors.removeFeature(box);
+ layer.addTo(map);
+ }
+ });
}
-function getMapCenter() {
- return map.getCenter().clone().transform(map.getProjectionObject(), epsg4326);
-}
+function addBoxToMap(bounds) {
+ var box = L.rectangle(bounds, {
+ weight: 2,
+ color: '#e90',
+ fillOpacity: 0
+ });
-function setMapCenter(center, zoom) {
- zoom = parseInt(zoom);
- var numzoom = map.getNumZoomLevels();
- if (zoom >= numzoom) zoom = numzoom - 1;
- map.setCenter(center.clone().transform(epsg4326, map.getProjectionObject()), zoom);
-}
+ box.addTo(map);
-function setMapExtent(extent) {
- map.zoomToExtent(extent.clone().transform(epsg4326, map.getProjectionObject()));
+ return box;
}
-function getMapExtent() {
- return map.getExtent().clone().transform(map.getProjectionObject(), epsg4326);
-}
-
-function getMapZoom() {
- return map.getZoom();
-}
-
-function getEventPosition(event) {
- return map.getLonLatFromViewPortPx(event.xy).clone().transform(map.getProjectionObject(), epsg4326);
+function getMapBaseLayer() {
+ for (var i = 0; i < layers.length; i++) {
+ if (map.hasLayer(layers[i].layer)) {
+ return layers[i];
+ }
+ }
}
function getMapLayers() {
- var layerConfig = "";
-
- for (var i = 0; i < map.layers.length; i++) {
- if (map.layers[i].layerCode && map.layers[i].getVisibility()) {
- layerConfig += map.layers[i].layerCode;
- }
- }
+ for (var i = 0; i < layers.length; i++) {
+ if (map.hasLayer(layers[i].layer)) {
+ return layers[i].layerCode;
+ }
+ }
- return layerConfig;
+ return "";
}
function setMapLayers(layerConfig) {
- if (layerConfig.charAt(0) == "B" || layerConfig.charAt(0) == "0") {
- var l = 0;
-
- for (var layers = map.getLayersBy("isBaseLayer", true), i = 0; i < layers.length; i++) {
- var c = layerConfig.charAt(l++);
-
- if (c == "B") {
- map.setBaseLayer(layers[i]);
- } else {
- map.layers[i].setVisibility(false);
- }
- }
- } else {
- for (var i = 0; i < map.layers.length; i++) {
- if (map.layers[i].layerCode) {
- if (layerConfig.indexOf(map.layers[i].layerCode) >= 0) {
- if (map.layers[i].isBaseLayer) {
- map.setBaseLayer(map.layers[i]);
- } else {
- map.layers[i].setVisibility(true);
- }
- } else if (!map.layers[i].isBaseLayer) {
- map.layers[i].setVisibility(false);
- }
- }
- }
- }
-}
-
-function scaleToZoom(scale) {
- return Math.log(360.0/(scale * 512.0)) / Math.log(2.0);
+ var foundLayer = false;
+ for (var i = 0; i < layers.length; i++) {
+ if (layerConfig.indexOf(layers[i].layerCode) >= 0) {
+ map.addLayer(layers[i].layer);
+ foundLayer = true;
+ } else {
+ map.removeLayer(layers[i].layer);
+ }
+ }
+ if (!foundLayer) {
+ map.addLayer(layers[0].layer);
+ }
}
projects / rails.git / blobdiff