aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorChristopher Baines <cbaines8@gmail.com>2013-02-03 13:29:26 +0000
committerChristopher Baines <cbaines8@gmail.com>2013-02-03 13:29:26 +0000
commita4367d5c946cea388851d511c8c1e41b9c6b617f (patch)
treecb75475c56fb31797b7f088215b1ac94fea6f8a0
parentabc87bf4e219dff3b89219423e2aa6873e0c1844 (diff)
downloadhealth-map-a4367d5c946cea388851d511c8c1e41b9c6b617f.tar
health-map-a4367d5c946cea388851d511c8c1e41b9c6b617f.tar.gz
Add popups for settlements
-rw-r--r--resources/map.js28
1 files changed, 27 insertions, 1 deletions
diff --git a/resources/map.js b/resources/map.js
index b51e456..6567510 100644
--- a/resources/map.js
+++ b/resources/map.js
@@ -186,7 +186,23 @@ function displayMap(self, map) {
color: 'black',
dashArray: '3',
fillOpacity: 0.1};
- }
+ },
+ onEachFeature: function(feature, layer) {
+ var center;
+ if (feature.geometry.type === "Point") {
+ center = feature.geometry.coordinates;
+ } else {
+ center = feature.geometry.coordinates[0];
+ }
+
+ var displayProperties = { name: feature.properties["name"], population: feature.properties["population"] };
+ if (typeof displayProperties["name"] == "undefined")
+ displayProperties["name"] = "Unknown";
+ if (typeof displayProperties["population"] == "undefined")
+ displayProperties["population"] = "Unknown";
+
+ layer.bindPopup(self.settlementPopupTemplate({ properties: feature.properties, coordinate: center }));
+ },
});
map.addLayer(self.villageLayer);
self.layersControl.addOverlay(self.villageLayer, "Settlements");
@@ -259,6 +275,16 @@ $(document).ready(function() {
<tr><td>Average distance of all settlements from health structure</td><td align="right"><%= properties["average_settlement_dist"] %></td></tr>\
</table>');
+ self.settlementPopupTemplate = _.template('<a href="http://www.openstreetmap.org/edit?editor=potlatch2&lat=<%= coordinate[1] %>&lon=<%= coordinate[0] %>&zoom=18">\
+<img src="resources/img/potlatch.png"></a>\
+<a href="http://www.openstreetmap.org/edit?editor=remote&lat=<%= coordinate[1] %>&lon=<%= coordinate[0] %>&zoom=18">\
+<img src="resources/img/josm.png"></a>\
+<h3>Settlement</h3>\
+<table width="100%">\
+<tr><td>Name</td><td align="right"><%= properties["name"] %></td></tr>\
+<tr><td>Population</td><td align="right"><%= properties["population"] %></td></tr>\
+</table>');
+
self.tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'