Obtain Adafruit IO Key
You will need your Adafruit IO username and secret API key.
Navigate to Adafruit IO and click the Adafruit IO Key button to retrieve these values. Write them down in a safe place, you'll need them later.
Create Group
This guide will use multiple Adafruit IO feeds to store sensor values. To organize these feeds, you will need to create a new group.
Navigate to your Adafruit IO Feeds page. Click Actions -> Create a New Group Name the group Air Quality Sensor. You can optionally set a description. Click Create |
Add Feeds to Group
Lets add a few feeds to the Air Quality Sensor group to hold sensor measurements and metadata.
Click Actions -> Create a New Feed Name the feed AQI Click Add to Groups and select the Air Quality Sensor group Click Create |
|
Repeat the process in the step above to create feeds for category (AQI category), temperature, and humidity. |
Before proceeding, make sure your Air Quality Sensor group looks exactly like the screenshot below.
Adafruit IO Dashboard
Dashboards allow you to visualize data and control Adafruit IO connected projects from any modern web browser. We'll be adding gauge widgets to visualize data from the air quality sensor in real-time and charts to display data historically.
Navigate to the dashboards page on Adafruit IO. Click Actions -> Create New Dashboard Name the dashboard My Air Quality Sensor Click Create |
You should see your new dashboard pop-up in the list of Dashboards. Click the My Air Quality Sensor dashboard link to navigate to the dashboard page.
You should see an empty dashboard. Let's fill it with blocks!
Click the '+' button on your dashboard to add a new block.
Let's add a text block to display the air quality condition (Good, Acceptable, Moderate, etc) sent by the sensor.
From the Create a New Block picker, click the Text Block
From the Create a New Block picker, click the Text Block On the Choose Feed picker, select the category feed Under Block Settings:
|
You should see the AQI Category text box appear on the dashboard. We'll organize the dashboard last - let's add the next block.
Add Gauge Block for Real-Time AQI
The United States Environmental Protection Agency uses an Air Quality Index (AQI) to communicate air quality. While computing the AQI according to the EPA requires a 24 hour average, this gauge displays the real-time AQI.
- Note: This guide uses air quality breakpoints and conditions developed by the USA EPA. Other countries have environmental protection agencies with similar countries with air quality indexes using PM2.5 particles. Check out this Wikipedia page for more info.
Click Create a New Block Select the Gauge Block Select the aqi feed Under Block Settings:
|
Your dashboard should now show the AQI category text block and the Real-Time AQI gauge.
Add Gauge Block for Humidity
We'll add another gauge block to display the BME280's humidity reading.
Click Create a New Block Select the Gauge Block Select the humidity feed Under Block Settings:
|
Add Gauge Block for Temperature
We'll add another gauge block to display the BME280's temperature reading.
Click Create a New Block Select the Gauge Block Select the humidity feed Under Block Settings:
|
Add Line Charts
While real-time visualization of PM2.5 measurements over time is immediately useful - looking at the air quality index over time will help you understand the AQI as a more accurate average. Adafruit IO's Line Charts update dynamically whenever new values are pushed to the feed.
Since most environmental groups use a 24-hour average of AQI measurements, we'll create a new line chart block to display the AQI measurements for the past day.
Click Create a New Block Select the Line Chart Block Select the aqi feed Under Block Settings:
Click Create Block |
Let's make another line chart block to display the AQI from the past week.
Click Create a New Block Select the Line Chart Block Select the aqi feed Under Block Settings:
Click Create Block |
You can drag the dashboard blocks around to re-organize your dashboard.
Before moving on, make sure your dashboard contains the same blocks as the screenshot below