diff options
-rw-r--r-- | .gitmodules | 3 | ||||
-rw-r--r-- | index.html | 2 | ||||
m--------- | resources/heatmap | 0 | ||||
-rw-r--r-- | resources/map.js | 24 |
4 files changed, 28 insertions, 1 deletions
diff --git a/.gitmodules b/.gitmodules index 377a496..44adeff 100644 --- a/.gitmodules +++ b/.gitmodules @@ -10,3 +10,6 @@ [submodule "resources/leaflet-minimap"] path = resources/leaflet-minimap url = git://github.com/Norkart/Leaflet-MiniMap.git +[submodule "resources/heatmap"] + path = resources/heatmap + url = git://github.com/pa7/heatmap.js.git @@ -19,6 +19,8 @@ <script src="resources/leaflet/dist/leaflet-src.js"></script> <script src="resources/leaflet-hash/leaflet-hash.js"></script> + <script src="resources/heatmap/src/heatmap.js"></script> + <script src="resources/heatmap/src/heatmap-leaflet.js"></script> <script src="resources/libs/locate/L.Control.Locate.js"></script> <script src="resources/leaflet-minimap/src/Control.MiniMap.js"></script> <script src="resources/op2geojson.js"></script> diff --git a/resources/heatmap b/resources/heatmap new file mode 160000 +Subproject e69a5bbedfd9718ebe0ac2bf161a28503c1285e diff --git a/resources/map.js b/resources/map.js index 64484f3..8a006bc 100644 --- a/resources/map.js +++ b/resources/map.js @@ -172,6 +172,21 @@ function initMap(self) { map.addLayer(self.settlementsLayerGroup); self.layersControl.addOverlay(self.settlementsLayerGroup, "Settlements"); + self.populationHeatMap = new L.TileLayer.heatMap({ + radius: 20, + opacity: 0.8, + gradient: { + 0.45: "rgb(0,0,255)", + 0.55: "rgb(0,255,255)", + 0.65: "rgb(0,255,0)", + 0.95: "yellow", + 1.0: "rgb(255,0,0)" + } + }); + + map.addLayer(self.populationHeatMap); + self.layersControl.addOverlay(self.populationHeatMap, "Population Heat Map"); + var emptyFeatureCollection = { type: "FeatureCollection", features: [] }; var hospitalIcon = L.icon({ @@ -360,14 +375,20 @@ function displayMap(self, map) { var displayProperties = { name: feature.properties["name"], population: feature.properties["population"] }; if (typeof displayProperties["name"] == "undefined") displayProperties["name"] = "Unknown"; - if (typeof displayProperties["population"] == "undefined") + if (typeof displayProperties["population"] == "undefined") { displayProperties["population"] = "Unknown"; + } else { + self.populationHeatMapData.push({lat: center[1], lon: center[0], value: feature.properties.population}); + } layer.bindPopup(self.editorTemplate({coordinate: center}) + self.settlementTemplate(displayProperties)); } }); self.settlementsLayerGroup.addLayer(self.catchmentAreaSettlementsLayers[catchmentArea.id]); + self.populationHeatMap.addData(self.populationHeatMapData); + self.populationHeatMap.redraw(); + var healthPost = self.healthPosts[catchmentArea.properties.subject]; var center; @@ -393,6 +414,7 @@ function displayMap(self, map) { _.each(self.amenitiesShown, function(amenity) { self.amenities[amenity] = []; }); + self.populationHeatMapData = []; // Convert the data to GeoJSON self.converter.fetch("http://overpass-api.de/api/interpreter", query, zoom, function(data) { |