Merge pull request #83 from DanielJDufour/36

fixed issue #36
CDCgov · Dec 18, 2018 · 2b2c0b5 · 2b2c0b5
2 parents 7b6adf5 + c645cd1
commit 2b2c0b5
Showing 1 changed file with 32 additions and 0 deletions.
diff --git a/components/geo_map.html b/components/geo_map.html
@@ -10,6 +10,10 @@
     <button id="map-fit" type="button" class="btn btn-light btn-sm" title="Center and Scale Network">
       <span class="oi oi-target"></span>
     </button>
+    <button id="map-layer-upload" type="button" class="btn btn-light btn-sm" title="Upload Map Layer">
+      <span class="oi oi-data-transfer-upload"></span>
+    </button>
+    <input type="file" id="map-file-input" style="display: none" multiple/>
   </div>
 
   <div id="map-settings-pane" class="left-pane" style="z-index:1000">
@@ -587,6 +591,34 @@ <h5 class="modal-title">Export Geospatial Data</h5>
       map.flyToBounds(layers.nodes.getBounds());
     });
 
+
+    $('#map-layer-upload').on('click', function() {
+      $('#map-file-input').click();
+    });
+
+    $('#map-file-input').on('change', event => {
+      Array.from(event.target.files).forEach(file => {
+        const { name } = file;
+        if (name.endsWith(".geojson")) {
+          const layerName = name.toLowerCase().replace(".geojson", "");
+          const reader = new FileReader();
+          reader.onload = function(event) {
+            app.mapData[layerName] = JSON.parse(event.target.result);
+            layers[layerName] = L.geoJSON(app.mapData[layerName], {
+              color: '#f00',
+              weight: .75,
+              fillColor: '#fafaf8',
+              fillOpacity: .5
+            });
+            layers[layerName].addTo(map);
+          };
+          reader.readAsText(file);
+        } else {
+          alert("Only GeoJSON Files are currently Supported.");
+        }
+      });
+    });
+
     function resetStack(){
       //Tile Layers, in reverse order:
       if(layers.satellite && session.style.widgets['map-satellite-show']) layers.satellite.bringToBack();