Build a dashboard in IoTConnect to monitor pump status

Intro

In PART 1 of this project, we set up a pump and created an AI model in Edge Impulse that can run on Avnet's RASynBoard and detect whether a pump is running, clogged, out of water, or off.

It would be nice to be able to check the pump status over time on a dashboard.

Some things I would like to be able to see in a dashboard:

• Pump status over time
• The current pump status
• The time the pump has been running (in seconds)
• Pump problems by category

I mocked up a dashboard in PowerPoint with the data that I would like to see:

There are lots of fantastic tools that enable you to construct a dashboard using telemetry. Thankfully, Brian Willess has already incorporated one - IoTConnect - into the RASynBoard out of box demo project, and it just takes a few steps to set it up.

MODIFY THE OUT OF BOX PROJECT IN E2 STUDIO

Brian Willess has an excellent getting started guide for the OOB application, so please refer to that if you get stuck on any of the steps below.

• The first step is to install Renesas E2 Studio. You can find the installer here: https://www.renesas.com/us/en/software-tool/e-studio#downloads

I am using Windows version 4.2, but the latest version should work.

• The next step is to clone the OOB project.

git clone https://github.com/Avnet/RASynBoard-Out-of-Box-Demo.git

Import the OOB project to E2 Studio

• Launch E2 StudioCreate a new workspace by browsing to the directory for your new workspace
• Click "Launch"
• e^2 Studio Launches and presents the Welcome Screen
• Select the "Import existing projects" optionThe "Import Projects" dialog is displayed
• Use the "Browse..." button to browse the file system, select the cloned project directory
• Leave all the options at the default state
• Click the "Finish" button

The project is imported into e^2 Studio

Generate the FSP

Next we'll generate the "Flexible Software Package" (FSP) code

• Expand the project file tree in the "Project Explorer" window at the left side
• Double click on "configuration.xml" to open the FSP explore
• If a dialog opens complaining about the current version of FSP installed, just accept the new version
• The Stacks Configuration tab opens
• Click on the "Generate Project Content" link in the upper right hand corner
• The "Generate Project Content" dialog opens, select the "Proceed" button
• The project content is generated

Build the Project

From the pull down menus select Project -> Build All or use the Ctrl+Alt+B keyboard shortcut.

The project builds and generates output files in the Debug Directory

In the build directory we can see the output files. Two files we're interested in are:

• rasynboard_ew_demo.elf. This is the file we'll load with the debugger
• rasynboard_ew_demo.srec. This is the file we can distribute and side-load onto RASynBoard hardware using the Renesas Flash Programmer application

Setup the Hardware

In the last project, you set up the hardware to run inference on the board. This is the same setup to debug, so you can leave the hardware in this configuration:

For now, you'll leave the Micro SD card files the same as we left them in the last project.

For reference, make sure that config.ini has the following settings:

Mode=4 

(this will ensure that your edge impulse model you created in the last project is loaded)

Port=1

This will ensure that you're using the UART to receive debug info from the RASynBoard.

Debug the project

Now we can load and run the project on the RASynBoard!

• Click on the green bug icon in the toolbar

If a dialog opens up confirming the Perspective Switch, select the "Switch" button

• The application is transferred to the board
• Application execution stops at the call to "SystemInit()"Press the F8 key to resume execution
• Application execution stops at the first line in the main() functionPress the F8 key to resume execution
• The application starts up and outputs debug showing the device loading the NDP120 images from the microSD card

If you open Teraterm or another terminal application and set it to your USB to TTL cable's port, you should see something like this:

Modify the project

In order to get the telemetry we want into IOTConnect, we'll change a few things in the OOB project.

Everything you need to change is found within the file /src/ndp_thread_entry.c

Line 119 constructs the telemetry JSON:

// Create the JSON
    snprintf(telemetryMsg, sizeof(telemetryMsg), "{\"msgCount\": %d, \"inferenceIdx\": %d, \"inferenceStr\": \"%s\"}", msgCnt++, inferenceIndex, inferenceString, );

We want to send a value with the pump's runtime. Runtime includes any time that the pump is not clogged or off.

In the switch statement on line 253, modify each case to collect the running time if it's on, e.g.:

switch (ndp_class_idx) {
				case 0:
				    /* Sound: out of water; light Amber Led */
					if(isRunning)
					{
						current_stat.timestamp = xTaskGetTickCount();
						duration = duration + (current_stat.timestamp - last_stat.timestamp);
						int pumpTime = (duration / 1000UL);
						enqueTelemetryJson(pumpTime, ndp_class_idx, labels_per_network[ndp_nn_idx][ndp_class_idx]);
					}
					else
					{
						isRunning = true;
					}
					current_stat.led = LED_EVENT_NONE;
					q_event = led_event_color(ndp_class_idx);
					xQueueSend(g_led_queue, (void *)&q_event, 0U );
					send_ble_update(ble_at_string[V_WAKEUP], 1000, buf, sizeof(buf));
					break;

Modify the telemetry on line 119 to match:

// Create the JSON
snprintf(telemetryMsg, sizeof(telemetryMsg), "{\"msgCount\": %d, \"pumpTime\": %d, \"inferenceIdx\": %d, \"inferenceStr\": \"%s\"}", msgCnt++, pumpTime, inferenceIndex, inferenceString);

You can find the completed code at the branch here.

We're now ready to connect our device to IoTConnect.

CREATE A FREE ACCOUNT ON IOTCONNECT

Until recently the Avnet IoTConnect platform was implemented only in the Azure cloud. However, in Feb 2023 the IoTConnect team has released the platform on AWS. This example only runs on the AWS implementation.

The IoTConnect team is currently working on a IoTConnect on AWS self-sign-up portal for new customers to request a free trial account. The self-signup page is scheduled to release in Jan 2024. Until then, please request a trial account by contacting the IoTConnect sales team.

• Navigate to the IoTConnect Contact us web page
• Fill out the form with your contact information
• In the "Please describe your request:" text box paste in the text "I would like to request a free trial IoTConnect account to explore the Avnet RASynBoard Out-of-Box demo on IoTConnect AWS."

Once you have an account on IoTConnect come back to complete the rest of the project :)

CREATE A NEW DEVICE IN IOTCONNECT

Here are the high level tasks we need to complete in IoTConnect:

• Create a device template
• Create a new IoT device
• Download the certificates for your device

Create a Device Template

The first thing we need to do is create a device template, since the template is a required input when we create a new IoTDevice. A device template is a self-contained file that defines a set of resources, configuration, and rules for devices on IoTConnect. We're going to create a very simple template for the OOB application.

• Open the devices page
• Select the Templates tab from the bottom of the page

A note about the items we'll add to the device template. We're going to add template attributes, these are the telemetry items that the application will send to IoTConnect each time the NDP120 detects an inference event, i.e., "Up." When we define attributes we're defining {"key": value} JSON pairs. The application must use the exact same key when sending telemetry data. The keys we'll define match the Avnet OOB application implementation. If you change or add additional telemetry items, just make sure the application matches your IoTConnect template attributes.

Note that we're creating 4 {"key": value} pairs. msgCount, inferenceIdx,inferenceStr, and pumpTime.

To create a new template:

• Select the Create Template button in the upper right hand corner.
• The Create Template form opensGive your template a code (must be 10 characters or less)Give your template a nameAuthentication type is x509 (IoTConnect will generate certificates for our device)Select 2.1 for the Device Message VersionSelect the Save button

• Select the Attributes tab, add the details shown in the following screenshots for msgCount, inferenceIdx,inferenceStr, and pumpTime. Click save for each one:

Create a new device

• Open the devices page again
• Select the Devices tab from the bottom of the page
• Select the Create Device button in the upper right hand corner

The Create Device form opens. Fill it out and click the Save button

• For the Entity field, you likely only have one option and it will be different than mine; select the only option shown in your interface.
• Under Template, select the template you just created.

Your device will be shown in the devices list.

Download certificates

When we created the new device, IoTConnect generated the device certificate and the device public key certificate.

• Open the device by clicking on the Unique ID link, in my case RASynBoardDemo.
• Click on the Connection Info link
• The Connection Info pop-up opens, showing all the nitty gritty details for your device on AWS.
• Click on the certificate download link
• Your certificates are downloaded to your Downloads folder in a zip file.
• Close the Connection Info pop-up window

MODIFY THE AVNET OUT-OF-BOX APPLICATION WITH NEW DEVICE DETAILS

Collect required details from IoTConnect on AWS

There are three IoTConnect details we need to configure the OOB application to connect to our new device. We'll add them to the config.ini file on the RASynBoard microSD card. I recommend opening up a text document to capture these items.

Company ID (CPID) and Environment (env)

• The company ID and the Environment are both displayed on the Key Vault page. Note you can copy them by selecting the copy link to the left of the text

Device Unique ID

• The Unique ID can be found on the Devices page.
• Find your device and copy the Unique ID by using the copy link to the left of your device's Unique ID

Update files on the MicroSD card

To access the MicroSD Card:

• Either remove the microSD card from the RASynBoard and use a microSD card reader,
• OR run the OOB application and connect your USB-C cable to the USB-C connector on the core board:

• Unzip the folder containing your certificates.
• Copy them to the microSD card into the /certs directory
• The certs directory should already contain the AmazonRootCA1.pem file, if not copy it from the repo /ndp120/synkpg_files/certs folder

Update the config.ini file:

• Open the config.ini file on the MicroSD card.
• Update the all of the details in your config.ini after [WIFI], as shown:

RUN THE DEMO

You device should now show up as "Connected" under the Devices tab.

Click on the Device's UniqueID.

If you click on Live Data, you should be able to see the Telemetry as it arrives from the RASynBoard.

CREATE A DASHBOARD IN IOTCONNECT

We're now able to see our telemetry in IoTConnect, and we can even see it in graph format, but wouldn't it be nice to create some custom views?

In my dashboard, I wanted to have the following elements:

• A line chart showing status over time
• A tile showing current status
• A tile showing time the pump has been running (in seconds)
• A pie chart showing problems by category
• An image showing the diagram of the pump

Let's get started!

• In IoTConnect, select "Create Dashboard" from the top of the screen.
• Give your dashboard a name and select "Save."

You now have a blank canvas to start creating. Let's start by adding a line chart to show pump status over time.

• Open the "Live" tab from the bottom of the screen to see a number of widgets.
• Select "Bar Chart" and drag it onto the canvas. You can position it by dragging and dropping.
• Close the live tab by clicking the "x"
• Use the tab in the lower corner (1) to adjust the size of the line chart. Select the three dots in the upper corner (2) to edit the line chart's values.
• Under settings, select your device, and select the telemetry values you wish to display on the chart. I selected "InferenceIdx" to get inferences over time.
• Select "Apply" and close

Now we'll add a tile showing the pump's current status.

• Open the "Live" tab from the bottom of the screen again
• Select "Single Tile" and drag and drop it to the screen
• Select the three dots in the upper corner to edit the tile's values
• I selected InferenceStr as the attribute, and I also changed the name and made the font larger

Next, we'll add the piece de resistance: a tile showing time the pump has been running (in seconds).

• Once again, open the "Live" tab from the bottom of the screen.
• Select "Single Tile" and drag and drop it to the screen
• Select "pumpTime" as the attribute. Select "Apply."

To create a pie chart showing problems by category:

• Select "Pie Chart" from the live category
• Select "InfereceStr" as the attribute.
• You have to select a time, so I've selected the minimum - 10 minutes. Note that on the free account, if you go over your data points the pie chart will no longer work.
• Select "Apply."

At this point, you'll want to save your work (if you haven't already). Select "Save" in the upper right hand corner. To get back into editing mode, select "Edit" in the upper right hand corner.

You can also find your dashboards by clicking on "Dashboards" and selecting the one you just created.

We'll complete our dashboard by adding a simple static image showing the diagram of the pump.

• Select "Image" from the live tile category.
• Upload your image and select "Apply"

And that's it! I fiddled a little bit with the sizes and text colors, and this is my final dashboard:

Good job! You're managing your pump's status like a pro.