diff options
| author | Christopher Baines <cbaines8@gmail.com> | 2013-02-03 13:29:26 +0000 |
|---|---|---|
| committer | Christopher Baines <cbaines8@gmail.com> | 2013-02-03 13:29:26 +0000 |
| commit | a4367d5c946cea388851d511c8c1e41b9c6b617f (patch) | |
| tree | cb75475c56fb31797b7f088215b1ac94fea6f8a0 /resources | |
| parent | abc87bf4e219dff3b89219423e2aa6873e0c1844 (diff) | |
| download | health-map-a4367d5c946cea388851d511c8c1e41b9c6b617f.tar health-map-a4367d5c946cea388851d511c8c1e41b9c6b617f.tar.gz | |
Add popups for settlements
Diffstat (limited to 'resources')
| -rw-r--r-- | resources/map.js | 28 |
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 © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors' |