Background

Word wide, air pollution remains a major problem, taking years off people's life and currently available air quality measurements show us just how bad this problem is. Below is a snapshot taken today from http://aqicn.org

Pollution Map

While these rough air quality measurements give a general idea of the environmental health of a greater region and we can perhaps choose which cities or countries to visit or avoid, they do not provide the kind of detail that would allow us to improve our situations in our day to day lives such as avoiding a particularly polluted route or attraction. For this we need much more data for out local surroundings.

When trying to improve air quality, as we are learning in California, as progress that is made, it becomes much more difficult to make further reductions in air pollution. Because of this, we wanted to find a way not only to show where the pollution is, but also provide insights that could help others decide what changes to make within a region to improve air quality.

Description

Our project tackles three steps for improving air quality including taking measurements, displaying the data, and comparing it against trends in mobility.

In order to gather more air quality data, since the currently available sets we found were not sufficient, we decided to use a simple and inexpensive Arduino BLE control board connected to an air quality sensor. This sensor can be mounted to vehicle license plate and connect over Bluetooth to the driver's phone so transmit air quality data over a range of locations and make it publicly available in Verizon's ThingSpace.

We used the air quality gathered to generate a MapQuest heat map to clearly show where heavy pollution is detected within a particular region. This allows residents to avoid pollution and improve their health when making decisions such as choose which routes to take on their morning workout or selecting a park to visit with their kids. See code below for how we did it.

In addition to making people aware of the air quality around them, we also provide insight into how to improve it. Using the Arity mobility trends APIs we were able to provide information within a region about the movement of automobiles, a primary cause of air pollution. In our display, a user can select the zip code of their region of concern and get information about how many people are traveling to their or from their location at a particular time as well as where they are coming from or returning to.

This information combine with air quality by location can help people identify patterns that might lead them to finding ways of reducing pollution. For example, if too many people are driving to the park for the weekend for BBQs and increasing pollution, our application can help determine if the best solution is a bus route and where to put it, more efficient BBQs, or a new park closer to the visitors' homes.

<script type="text/javascript">
  window.onload = function() {
    L.mapquest.key = 'ptRSvWh2aIMDbujho7QWivyfDHrtvKFY';
    var baseLayer = L.mapquest.tileLayer('map');

    var map = L.mapquest.map('map', {
      center: [39.7392, -104.9903],
      layers: L.mapquest.tileLayer('map'),
      zoom: 11
    });

    //Some Example Air Quality Points
    var addressPoints = [
        [39.7392, -104.9903, "571"],
        [39.7869090667, -104.9194, "486"],
        [39.7894207167, -104.91947, "807"],
        [39.7927369333, -104.91943, "899"],
        [39.70585105, -104.91943, "1273"],
        [39.7064188833, -104.919456833, "1258"],
        [39.70584715, -104.9463564333, "1279"],
        [39.7033391333, -104.9244005667, "1078"],
        [39.7061991333, -104.9492620333, "1309"],
        [39.7058955167, -104.9445613167, "1261"],
        [39.78888045, -104.99146475, "734"],
        [39.7950811333, -104.91079175, "928"],
        [39.78909235, -104.9922956333, "740"],
        [39.7889259667, -104.9938591667, "759"],
        [39.7876576333, -104.9859563833, "687"],
        [39.75392, -104.9603, "571"],
        [39.76869090667, -104.9394, "486"],
        [39.78894207167, -104.95947, "807"],
        [39.7227369333, -104.98943, "899"],
        [39.73585105, -104.98943, "1273"],
        [39.7276576333, -104.9459563833, "687"]
    ];

    map.addControl(L.mapquest.control());

    addressPoints = addressPoints.map(function (addressPoint) { return [addressPoint[0], addressPoint[1]]; });

//ADD DATA TO MAPQUEST HEAT MAP
    L.heatLayer(addressPoints).addTo(map);

    function httpGetAsync(theUrl, callback)
    {
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.onreadystatechange = function() { 
            if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
                callback(xmlHttp.responseText);
        }
        xmlHttp.open("GET", theUrl, true);
        xmlHttp.send(null);
    }

//UPLOAD DATA FROM THINGSPACE
    httpGetAsync("https://thingspace.io/get/dweets/for/medical-yard", function(responseText) {
        var data = JSON.parse(responseText).with
        for (var i = 0; i < data.length; i++) {
            if (data[i].content.your_longitude != null) {
                console.log(data[i].content.your_latitude);
                console.log(data[i].content.your_longitude);
                console.log(data[i].content.mouse_x);
                addressPoints.push([data[i].content.your_latitude, data[i].content.your_longitude, data[i].content.mouse_x])
            }
        }
    });

//GET INSIGHTS FROM ACRITY
    document.getElementById("outbound").addEventListener("click", function() {
        var zip = document.getElementById("zip").value;
        httpGetAsync("https://api-beta.arity.com/shared-mobility-insights/v1/zip-codes/" + zip + "/origin-zip-codes?tripType=Personal&startDayOfWeek=Monday&startHour=11&duration=10", function(responseText) {
            var end = JSON.parse(responseText).destinationZipCode.centroid;
            var start = JSON.parse(responseText).originZipCodes;
            L.marker([end.lat, end.lng], {
                icon: L.mapquest.icons.flag({
                    primaryColor: '#22407F',
                    secondaryColor: '#3B5998',
                    shadow: true,
                    size: 'lg',
                    symbol: 'End'
                }),
                draggable: false
            }).bindPopup('Denver, CO').addTo(map);
            for (var i = 1; i < start.length; i++) {
                if (((start[i].tripPercentage * 100) + '').slice(0, ((start[i].tripPercentage * 100) + '').indexOf(".")) == '0') {
                    L.marker([start[i].centroid.lat, start[i].centroid.lng], {
                    icon: L.mapquest.icons.via({
                        primaryColor: '#98593B',
                        secondaryColor: '#22407F',
                        size: 'md'
                    }),
                        draggable: false
                    }).bindPopup((start[i].tripPercentage * 100) + ' Percent').addTo(map);
                } else {
                    L.marker([start[i].centroid.lat, start[i].centroid.lng], {
                    icon: L.mapquest.icons.flag({
                        primaryColor: '#22407F',
                        secondaryColor: '#98593B',
                        shadow: true,
                        size: 'sm',
                        symbol: ((start[i].tripPercentage * 100) + '').slice(0, ((start[i].tripPercentage * 100) + '').indexOf("."))
                    }),
                        draggable: false
                    }).bindPopup((start[i].tripPercentage * 100) + ' Percent').addTo(map);
                }
            }
        });
    });

    document.getElementById("inbound").addEventListener("click", function() {
        var zip = document.getElementById("zip").value;
        httpGetAsync("https://api-beta.arity.com/shared-mobility-insights/v1/zip-codes/" + zip + "/destination-zip-codes?tripType=Personal&startDayOfWeek=Monday&startHour=11&duration=10", function(responseText) {
            var start = JSON.parse(responseText).originZipCode.centroid;
            var end = JSON.parse(responseText).destinationZipCodes;
            L.marker([start.lat, start.lng], {
                icon: L.mapquest.icons.flag({
                    primaryColor: '#22407F',
                    secondaryColor: '#3B5998',
                    shadow: true,
                    size: 'lg',
                    symbol: 'Start'
                }),
                draggable: false
            }).bindPopup('Denver, CO').addTo(map);
            for (var i = 1; i < end.length; i++) {
                if (((end[i].tripPercentage * 100) + '').slice(0, ((end[i].tripPercentage * 100) + '').indexOf(".")) == '0') {
                    L.marker([end[i].centroid.lat, end[i].centroid.lng], {
                    icon: L.mapquest.icons.via({
                        primaryColor: '#98593B',
                        secondaryColor: '#22407F',
                        size: 'md'
                    }),
                        draggable: false
                    }).bindPopup((end[i].tripPercentage * 100) + ' Percent').addTo(map);
                } else {
                    L.marker([end[i].centroid.lat, end[i].centroid.lng], {
                    icon: L.mapquest.icons.flag({
                        primaryColor: '#22407F',
                        secondaryColor: '#98593B',
                        shadow: true,
                        size: 'sm',
                        symbol: ((end[i].tripPercentage * 100) + '').slice(0, ((end[i].tripPercentage * 100) + '').indexOf("."))
                    }),
                        draggable: false
                    }).bindPopup((end[i].tripPercentage * 100) + ' Percent').addTo(map);
                }
            }
        });
    });

    document.getElementById("clear").addEventListener("click", function() {
        location.reload();
    });
  }
</script>

Inbound Mobility Trends Outbound Mobility Trends Clear

Built With

Share this project:
×

Updates