Air quality monitoring using the M5Stack Air Quality Kit and the Waylay IO platform.

Related Waylay IO articles

Things used in this project

1. Hardware components

M5Stack PM 2.5 SENSOR USB POWER/SHT20 (PMSA003)

2. Software apps and online services

Thonny

M5Stack M5Burner

Waylay IO

Story

Motivation

Air Quality is one of those things you do not pay attention to when things are the way they should be, but you become acutely aware of when it reaches unhealthy levels, especially for those who are sensitive such as children, people with cardio-pulmonary diseases, and other respiratory ailments.

Air quality varies vastly even in a small region because pollution can build up around industries or busy areas, so it is important to monitor what is happening in your immediate proximity. Check out this link to find out more about AQI (Air Quality Index) and the state of air quality in cities throughout Europe.

To address this issue, in this tutorial we will show you how to gather air quality data using an IoT device, store them in the cloud and showcase them in a neatly organized dashboard.

So let’s dive right into it!

We have picked the M5Stack Air Quality Kit based on the PMSA003 Digital laser dust sensor for this application. The M5Stack ecosystem is based on the ESP32 SoC and is beautifully integrated with a big enough screen for a User Interface.

M5Stack Air Quality Kit
M5Stack Air Quality Kit
M5Stack Air Quality Kit
M5Stack Air Quality Kit

Prerequisites

M5Burner
M5 Burner
  • Install Thonny following the steps on the official website.
Thonny Python IDE
Thonny Python IDE

Setting up the device

  • Connect the M5Stack kit to your PC using the provided USB Type-C cable.
  • Launch M5Burner, download the UIFlow(CORE). Click the Erase button, wait for it to finish, and then press the Burn button to upload the UIFlow(CORE) firmware on the device. We have used 1.8.1_en . You will be prompted for the WiFi details that the device will use to connect to your local network. If the burn fails, change the baud rate to a lower one.

On Linux, make sure your user is part of the dialout group by running:

sudo adduser $USER dialout
M5Burner interface
  • The device will be programmed and you will be greeted by a series of screens showcasing the available features.
  • All is well. Now let's set up the cloud solution!

Setting up the cloud solution

Register on Waylay IO if you have not already and log in.

  • Go to Resources and add a resource. Name it something like AirQuality. This resource is practically your device representation in the cloud where you will send the data.
  • Add a new property with the customer key and the Zalmotek value.
  • Add another property with the tags key and the [ "AirQualityMonitor" ] value.
Creating a resource on Waylay.io
  • Go to Webscripts in the left main menu and add a new one. Name it something like AirQualityIngestion and add the following details in the body:
async function handleRequest (req, res) {
if (!req.body) {
// No body found
return
}

// Parse body if needed
let payload = req.body
if (typeof payload === 'string' || payload instanceof String)
payload = JSON.parse(payload)

/*
You can do some processing of the payload over here.
*/

// Post values to our resource
waylay.data.baseUrl = 'https://data-io.waylay.io'
await waylay.data.postSeries('replace_with_resource_id', payload, { store: true, forward: true })
.catch(e => console.error(e.message))

res.sendStatus(200)
}

Be sure to replace the replace_with_resource_id placeholder with the actual resource_id from the above step. Navigate to the resource page to get it. Ours is something like 453472c9-8553-4b12-b24f-fc6e052e8255 . Press Save once you have pasted the correct details.

Programming the device

  • Go to the GitHub repository of this project (also present in the Code block of this tutorial) and download the zip file containing all necessary code and unpack it in a folder (or use the git command-line interface to do the same thing like a pro).
  • Launch Thonny and from Run -> Select interpreter set up the interpreter to MicroPython (ESP32) and while at it pick the device port.
Thonny interface - selecting the interpreter

  • Make sure the M5Stack is connected and displaying the API screen (or with the hello world program open), click on the Shell text field and press CTRL+C or press the STOP button to connect to the device. Once you see the >>> symbol, you can access the files on the device. Go to View and select Files to set up your workspace. Then go to the temp.py file provided in this tutorial (check the Github Repository link in the Code section below) and edit the URL in the SendPOST() function with the URL of your Webscript. You can find it on https://console-io.waylay.io/webscripts, below the name of your Webscript. Click it to copy it to the clipboard (make sure the secret is included).
  • Select all the files from the folder downloaded from GitHub by holding Shift and clicking the files ( main.py , and the 2 folders custom, res, files provided in this tutorial, exclude the Readme file, right-click on the menu icon (3 horizontal lines as shown below) and press Upload to /flash, press ok and you are set. Confirm the files being overwritten.


  • Reboot the M5Stack by pressing the side button and the app should start automatically after connecting to your WiFi.
  • When the device successfully sends the data to the server you will get a Data sent message on the bottom-left side of the display and the 200 HTTP status code on the bottom-right side of the display (meaning the request was successfully received, understood, and accepted).
Air quality monitoring using M5Stack and Waylay IO

Setting up an alarm

Alarms are a useful feature that helps you avoid strutting down the street when the air quality levels reach a dangerous level.

  • Select the Templates field from your user console and click on the Add Template button.
  • To create a basic alarm flow, we will be adding the necessary blocks from the blocks menu and then configure them. Add a Stream block, uncheck execute on tick and check execute on data, then select your Resource of choice.
  • Add a Condition block, uncheck execute on tick and check execute on data, then select your Resource of choice. In the condition field write up the condition in the following format:
${nodes.stream_1.rawData.stream.replace_with_your_metric}
  • In our example, the metrics you can choose from are the ones defined in the DataMap variable in temp.py (PM1, PM2_5, PM10). Our condition looks like this:
${nodes.stream_1.rawData.stream.replace_with_your_metric} > 50
Setting the alarm condition on Waylay IO
  • Add a Create Alarm block, uncheck execute on tick and check execute on data, and select your Resource of choice. Also fill in your alarm text, your desired alarm type (CRITICAL, MAJOR, MINOR, or WARNING), and create an alarm type.
Creating an alarm on Waylay IO

  • Click on the Save button and choose a name for your template.
  • Now that you have returned to the Templates menu, select the previously created template and click on Create Task.
Creating a task on Waylay.io
  • Choose a name for your task, select the Resource choosing Reactive mode and click on Create Task.
Creating a task on Waylay IO
  • Now the Task is created and when the condition is met, an alarm will be triggered and it will be displayed in the Alarms field of your console and also in your dashboard linked to the same Resource as the Alarm.

Creating a dashboard

Now that we managed to consistently send data to our cloud solution, it’s time to set up a neat-looking dashboard to display it.

  • Head to https://dashboard-io.waylay.io/ and log in with your account data.
  • Create an organization by clicking on the + sign. The name of this organization must be identical to the customer name (metadata property) you have used when defining your Resource.
  • Click on Log in as admin.
  • Click on the + sign, click on Query, and in the tag field fill in the value of the tags property you have picked for your Resource.
Creating a dashboard on Waylay IO
  • Name your group and finally click on Create group.
  • Click on the + sign next to My dashboard and select the desired representation, select the metric you want to represent and then click Save.
  • For this use-case, we have settled for Gauge widgets to represent the momentary value of PM1.0, PM2.5 and PM10 in ug/m3 and a Scatterplot widget to represent the evolution of the mentioned parameters in time. Moreover, we have added an Alarm widget so we can monitor the latest alarms.
Creating a dashboard on Waylay IO
  • After adding all widgets, click on the cogwheel next to the + sign and then click Publish.
  • Click on My dashboard and select your dashboard (notice that the + sign disappears), click on the cogwheel, click on Manage and then select Public.
  • Now, by clicking on the connectivity button, you can get the link for your public dashboard to share with your friends or to access it from any browser (like this cool one).
1 / 2 • Dashboards on Waylay IO

What’s next?

We have a series of tutorials with other use cases that you could learn from and further sharpen your IoT skills or you could start your very own project.

Github Repository