Created
March 1, 2019 23:13
-
-
Save ericrobskyhuntley/f999414064d06f8bd01a1467c37cf358 to your computer and use it in GitHub Desktop.
Linking Leaflet Layers by ID
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Linking Leaflet Layers by ID</title> | |
| <style> | |
| #map {height: 850px;} | |
| </style> | |
| <link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" /> | |
| <!-- Must come after leaflet.css --> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | |
| <script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" type="text/javascript"></script> | |
| </head> | |
| <body> | |
| <div id="map"></div> | |
| <script src="map.js" type="text/javascript"></script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var animalMap = L.map('map').setView( | |
| center = [42.360724, -71.068711], | |
| zoom = 16); | |
| var tonerLite = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}.{ext}', { | |
| attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>', | |
| subdomains: 'abcd', | |
| minZoom: 0, | |
| maxZoom: 20, | |
| ext: 'png' | |
| }); | |
| tonerLite.addTo(animalMap); | |
| var bufferGroup = L.layerGroup().addTo(animalMap); | |
| $.getJSON("test_points.geojson", function(data) { | |
| var point = L.geoJSON(data, { | |
| onEachFeature: function(feature, layer) { | |
| var props = feature.properties; | |
| layer.on('click', function() { | |
| addBuffer(props.CASE_ENQUIRY_ID); | |
| }); | |
| } | |
| }).addTo(animalMap); | |
| }); | |
| function addBuffer(id) { | |
| bufferGroup.clearLayers(); | |
| $.getJSON("test_1p5km.geojson", function(data) { | |
| L.geoJSON(data, { | |
| filter: function(feature, layer) { | |
| return Math.round(feature.properties.CASE_ENQUI) == id; | |
| } | |
| }).addTo(bufferGroup); | |
| }) | |
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "type": "FeatureCollection", | |
| "name": "test_points", | |
| "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } }, | |
| "features": [ | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101002224305, "open_dt": "2017\/09\/23 11:47:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "78 Phillips St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0504", "LOCATION_STREET_NAME": "78 Phillips St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.3601, "Longitude": -71.0694, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0694, 42.3601 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101002171191, "open_dt": "2017\/07\/26 11:43:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "103 Myrtle St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0504", "LOCATION_STREET_NAME": "103 Myrtle St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.3594, "Longitude": -71.0683, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0683, 42.3594 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101001801423, "open_dt": "2016\/05\/27 19:57:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "40 S Russell St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 1, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 3, "ward": "Ward 3", "precinct": "0306", "LOCATION_STREET_NAME": "40 S Russell St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.36, "Longitude": -71.0658, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0658, 42.36 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101001530373, "open_dt": "2015\/08\/25 19:42:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "41 S Russell St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 1, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 3, "ward": "Ward 3", "precinct": "0306", "LOCATION_STREET_NAME": "41 S Russell St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.36, "Longitude": -71.0661, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0661, 42.36 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101001517343, "open_dt": "2015\/08\/10 14:50:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "120 Charles St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Back Bay", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0511", "LOCATION_STREET_NAME": "120 Charles St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.3592, "Longitude": -71.0709, "Source": "Constituent Call" }, "geometry": { "type": "Point", "coordinates": [ -71.0709, 42.3592 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101001407008, "open_dt": "2015\/06\/10 20:40:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "29-31 Revere St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0504", "LOCATION_STREET_NAME": "29-31 Revere St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.3597, "Longitude": -71.0673, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0673, 42.3597 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101001376953, "open_dt": "2015\/05\/13 16:40:00", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "29-31 Revere St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0504", "LOCATION_STREET_NAME": "29-31 Revere St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.3597, "Longitude": -71.0673, "Source": "Employee Generated" }, "geometry": { "type": "Point", "coordinates": [ -71.0673, 42.3597 ] } }, | |
| { "type": "Feature", "properties": { "CASE_ENQUIRY_ID": 101000970819, "open_dt": "2013\/11\/23 18:20:36", "target_dt": null, "closed_dt": null, "OnTime_Status": "ONTIME", "CASE_STATUS": "Open", "CLOSURE_REASON": "NA", "CASE_TITLE": "Animal Noise Disturbances", "SUBJECT": "Animal Control", "REASON": "Animal Issues", "TYPE": "Animal Noise Disturbances", "QUEUE": "INFO01_GenericeFormforOtherServiceRequestTypes", "Department": "INFO", "SubmittedPhoto": null, "ClosedPhoto": null, "Location": "34 Anderson St Boston MA 02114", "Fire_district": 3, "pwd_district": "1B", "city_council_district": 8, "police_district": "A1", "neighborhood": "Beacon Hill", "neighborhood_services_district": 14, "ward": "Ward 5", "precinct": "0504", "LOCATION_STREET_NAME": "34 Anderson St", "LOCATION_ZIPCODE": "2114", "Latitude": 42.36, "Longitude": -71.0676, "Source": "Constituent Call" }, "geometry": { "type": "Point", "coordinates": [ -71.0676, 42.36 ] } } | |
| ] | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment