aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--index.html1
-rw-r--r--resources/data.js9
-rw-r--r--resources/map.js96
3 files changed, 105 insertions, 1 deletions
diff --git a/index.html b/index.html
index 071f0a9..66d7327 100644
--- a/index.html
+++ b/index.html
@@ -18,6 +18,7 @@
<script src="resources/leaflet/dist/leaflet-src.js"></script>
<script src="resources/libs/locate/L.Control.Locate.js"></script>
<script src="resources/op2geojson.js"></script>
+ <script src="resources/data.js"></script>
</head>
<body>
<div id="map"></div>
diff --git a/resources/data.js b/resources/data.js
new file mode 100644
index 0000000..85a77c2
--- /dev/null
+++ b/resources/data.js
@@ -0,0 +1,9 @@
+function getVillages(area, zoom) {
+ var poly = "12.3 -12.3 12.4 -12.3 12.48 -12.25 12.35 -12.19";
+ var query = 'data=[out:json];(node(poly:"' + poly + '");<;);out;';
+
+ converter = new op2geojson();
+ converter.fetch("http://overpass-api.de/api/interpreter", query, zoom, function(data) {
+
+ });
+}
diff --git a/resources/map.js b/resources/map.js
index f261f3f..02a45d3 100644
--- a/resources/map.js
+++ b/resources/map.js
@@ -47,7 +47,6 @@ function displayMap(self, map) {
var ne = bounds.getNorthEast();
bbox = [sw.lat, sw.lng, ne.lat, ne.lng].join(',');
- // Get the data
var data = createQueryData(bbox);
// Convert the data to GeoJSON
@@ -146,6 +145,101 @@ function displayMap(self, map) {
});
}
});
+
+ converter.fetch("http://overpass-api.de/api/interpreter", data, zoom, function(data) {
+ if (jQuery.isEmptyObject(self.amenityLayers)) {
+ var markers = {};
+ var catchmentAreaForAmenity = {};
+
+ _.each(
+ _.filter(data.features,
+ function(feature) {
+ return _.contains(_.values(feature.properties), "catchment_area");
+ }),
+ function(catchmentArea) {
+ catchmentAreaForAmenity[catchmentArea.properties["subject"]] = catchmentArea;
+ });
+
+ // Now deal with the catchment areas
+ self.catchmentAreaLayer = L.geoJson(data, {
+ style: function(feature) {
+ return {fillColor: 'green',
+ weight: 2,
+ opacity: 1,
+ color: 'black',
+ dashArray: '3',
+ fillOpacity: 0.1};
+ },
+ onEachFeature: function(feature, layer) {
+ layer.on({
+ mouseover: highlightFeature,
+ mouseout: resetHighlight,
+ click: function() {
+ markers[feature.properties.subject].openPopup();
+ }
+ });
+ },
+ filter: function(feature, layer) {
+ return _.contains(_.values(feature.properties), "catchment_area");
+ }
+ });
+
+ _.each(self.amenities, function(amenity, i) {
+ self.amenityLayers[amenity] = L.geoJson(data, {
+ style: function(feature) {
+ return {color: 'red',
+ fillColor: 'red',
+ fillOpacity: 0.2,
+ weight: 10};
+ },
+ onEachFeature: function(feature, layer) {
+ var center;
+ if (feature.geometry.type === "Point") {
+ layer.options.icon = hospitalIcon;
+ center = feature.geometry.coordinates;
+ } else {
+ center = feature.geometry.coordinates[0];
+ }
+
+ var catchmentArea = catchmentAreaForAmenity[feature.id];
+
+ var format = new OpenLayers.Format.GeoJSON;
+ var openLayersGeo = format.parseGeometry(catchmentArea.geometry);
+
+ var areaInSquareMeters = openLayersGeo.getGeodesicArea();
+ var areaString = areaInSquareMeters.toFixed(2) + "m" + "2".sup();
+ if (areaInSquareMeters > 1000000) {
+ areaString = (areaInSquareMeters / 1000000).toFixed(2) + "km" + "2".sup();
+ }
+ var areaProperties = { area: areaString }
+
+ layer.bindPopup(self.popupTemplate({ properties: $.extend(feature.properties, areaProperties), coordinate: center }));
+
+ markers[feature.id] = layer;
+ },
+ filter: function(feature, layer) {
+ return _.contains(_.values(feature.properties), amenity);
+ }
+ });
+
+ map.addLayer(self.amenityLayers[amenity]);
+ self.layersControl.addOverlay(self.amenityLayers[amenity],
+ self.amenities[i].charAt(0).toUpperCase() + self.amenities[i].slice(1));
+ });
+
+ map.addLayer(self.catchmentAreaLayer);
+ self.layersControl.addOverlay(self.catchmentAreaLayer, "Catchment Areas");
+ } else {
+ self.catchmentAreaLayer.clearLayers();
+ self.catchmentAreaLayer.addData(data);
+
+ _.each(self.amenities, function(amenity, i) {
+ // Update the data for each amenity layer
+ self.amenityLayers[amenity].clearLayers();
+ self.amenityLayers[amenity].addData(data);
+ });
+ }
+ });
}
$(document).ready(function() {