2d:null 2e:["$","title",null,{"children":"Enviro Data Explorer | E. Kerney | Observable"}] 33:T435,md`
This conversion is accomplished in about 12 lines of code. This async function: airQualityIndex() - accomplishes the conversion of PM2.5 values into AQI. In the spirit of functional programming, this conversion function can also be utilized for the time interval AQI, 1 hour, 24 hour, and one week time frames: \`\`\`javascript const airQualityIndex = async (airValue) => { const c_low = [0, 12.1, 35.5, 55.5, 150.5, 250.5, 350.5], c_high = [12, 35.4, 55.4, 150.4, 250.4, 350.4, 500.4]; const aqi_low = [0, 51, 101, 151, 201, 301, 401], aqi_hi = [50, 100, 150, 200, 300, 400, 500]; const aqi_fac = [4.17, 2.10, 2.46, 0.52, 0.99, 0.99, 0.66] const aqi_range = ["Good","Moderate","Unhealthy for Sensitive Groups","Unhealthy","Very Unhealthy","Hazardous","Hazardous"]; for (z in aqi_range) { if (airValue > c_high[z]) { } else { aqi_val = (aqi_fac[z] * (airValue - c_low[z]) + aqi_low[z]); aqi_val = Math.round(aqi_val); aqi = aqi_range[z]; return {aqi_val, aqi}; } } }; \`\`\` `34:T447,md`##
Mapping And what good would all this geographic data be without a map! This map uses the leaflet.js library and USGS aerial image tiles for the basemap. The map consumes the Purple Air micro-service that was generated from the Purple Air JSON sensor feed. The JSON data was sent as a GET request with the sensor ID as URL parameter => processed in the node cloud function => transformed into GeoJSON with indexed properties => AQI calculation performed on raw PM2.5 values => then served in a GeoJSON endpoint that is easily consumable by Leaflet. Clicking on a station will show the station name along with the live and 24 hour Air Quality Data. The pop-up can be customized to add any additional attributes such as 1-hour or 1-week AQI, and the markers can be styled to indicate the AQ status, similar to the Purple Air map above. While this map and service only feature a small subset of the over 15,000 Purple Air sensors, it shows a working proof of concept that could be easily expanded for larger datasets, advanced styling, and other types of environmental media. `35:[{"id":"1480d32319f1ae6cd5bf9b078050b53d16b9c99a7a21c87bf92a57558dca690fe5fdea3167553f919715cec6f4f375f35a0a417e9e5c130379e48f43a30d5136","href":"https://static.observableusercontent.com/files/1480d32319f1ae6cd5bf9b078050b53d16b9c99a7a21c87bf92a57558dca690fe5fdea3167553f919715cec6f4f375f35a0a417e9e5c130379e48f43a30d5136","name":"AQI.png","type":"image/png","lastModified":1608305597700.104,"size":36092}] 31:{"id":"212ddd8173caadef","slug":"enviro-data-explorer","title":"Enviro Data Explorer","thumbnail":"0f217f9cb2cc23fe32bf77b484fed1c2a3086da735e3b4304a19098d723b605a","access_level":"public","create_time":"$D2020-12-18T13:13:35.851Z","update_time":"$D2021-02-23T03:49:02.152Z","view_time":null,"first_public_time":"$D2020-12-19T15:23:17.082Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"6773b9d940faa10e","login":"location-artistry","name":"E. Kerney","avatar_url":"https://avatars-next.observableusercontent.com/6a41b9491e318e4761cdb6210d6adb0880ed593495f2090cabed95169e3165f2","tier":"starter_2024"},"version":271,"publish_version":271,"role":null,"authored":false,"authors":[{"type":"individual","id":"06ed914427a4c051","login":"location-artistry","name":"E. Kerney","avatar_url":"https://avatars-next.observableusercontent.com/6a41b9491e318e4761cdb6210d6adb0880ed593495f2090cabed95169e3165f2","tier":null}],"members":[{"type":"individual","id":"06ed914427a4c051","login":"location-artistry","name":"E. Kerney","avatar_url":"https://avatars-next.observableusercontent.com/6a41b9491e318e4761cdb6210d6adb0880ed593495f2090cabed95169e3165f2","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Enviro Data Explorer","cells":[{"id":0,"value":"md`# Enviro Data Explorer \nAn Observable Notebook by Eric Kerney to explore environmental microservices written in node.js, hosted on Firebase as cloud functions, and also with JavaScript/html widgets that display real-time Environmental data from IoT sensors. \nObservableHQ Notebooks operate with a reactive topology, where all cells automatically execute when changed. Clicking on the three dots to the left of the cells will reveal the code. Text editing is based on Markdown syntax. Hit the reload button if an embed is not showing. \n
`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"md`## Purple Air Real-time Air Quality Monitoring \n[Purple Air](https://www2.purpleair.com/) is revolutionizing the field of air quality monitoring with cloud connected air quality sensors that only cost a few hundred dollars. While government air monitoring stations can cost ten's of thousands and be difficult to calibrate and maintain, homeowners, agencies & organizations around the world are connecting purple air quality sensors through wiFi networks. \nPurple Air has come into particular focus during the wildfire season of 2020, and [their map](https://www.purpleair.com/map) (based on Open Street Map) has become the goto for citizens to find localized AQ data. The interactive map is embedded as an iframe below, centered around Portland, OR`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"md`
\nPurple Air provides open access to their sensor network endpoints, and one or a multiple number of sensors can be queried via URL requests. Below is the URL for the a sensor in Portland, and the resulting JSON request. There are two entries in the array each representing a separate PM2.5 sensor. \nClick the arrow below to expand the json data: \nhttps://www.purpleair.com/json?show=2045`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"getAirData = {\n const dataUrl = (`https://www.purpleair.com/json?show=2045`);\n const dataFetch = d3.json(dataUrl, d3.autoType);\n return dataFetch;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"md`Building upon the real-time reading, I have created a micro-serivce with node.js to take in a URL list of comma separated sensor IDs. I observed that the sensor JSON contained (Lat, Lon) fields. Always looking for a opportunity to map spatial data, my service returns the data as a nicely formatted GeoJSON! The GeoJSON contains properties and geometry for each sensor. The endpoint for this particular request is: \nhttps://purpleairwidget.firebaseapp.com/purpleAirData/44439,2822,5712,43297,7772,37659 \nThe data for these six sensors is live below (click on the arrow to expand):\n
\n` ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"getAirService = {\n const dataUrl = (`https://purpleairwidget.firebaseapp.com/purpleAirData/44439,2822,5712,43297,7772,37659`);\n const dataFetch = d3.json(dataUrl, d3.autoType);\n return dataFetch;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"md`
The air quality data is given in raw PM2.5 concentrations, and needs to be converted to the Air Quality Index, which is based on a moving concentration formula shown below. \n
`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"FileAttachment(\"AQI.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":113,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":178,"value":"md`##
Air Quality Data Visualization`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"md`\nAnd finally here is the JavaScript widget that takes in the custom micro-service endpoint with the specified station IDs, and generates a status for each sensor. The DIV's are created dynamically, so any number of stations can be sent as URL parameters. These stations are all in southern Michigan. Depending on the current AQI the Status text and background will change from green-> yellow-> red\n
\n \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":233,"value":"viewof b2 = button({value: \"RELOAD WIDGET\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":232,"value":"{\n b2;\n return purpleWidget()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"function purpleWidget() {\nreturn html`` \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"{\n b3;\n return purpleMap()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":256,"value":"viewof b3 = button({value: \"RELOAD MAP\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"function purpleMap() {\n return html`` \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"md`## Appendices`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"d3=require('d3')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":228,"value":"import {button} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 32:"$31:body"