Azure

Rasberry Pi からAzure IoT Hub に送信したデータを可視化

はじめに

Rasberry Pi からAzure IoT Hub に送信したデータはそのままでは見ずらいです。そこで、可視化を行っていきます。

これは前回の続きです。送信したデータを可視化します。

技術的な何か。
Rasberry Pi からAzure IoT Hub にデータを送信する
🕒️2023年1月26日
はじめにRasberry Pi からAzure IoT Hub にデータを送信する方法を紹介していきます。前回の記事の続きになります。前回の記事では、Raspberry Pi 4+ BMS280 + MH-Z19B でディスプレイでモニタリングする方法を紹介しましたが、これではデータをリアルタイムに表示させるだけでオンラインでも確認できません。そこでAzure IoT Hub を利用してデータを送信していきます。また、次回は可視化を行います。IoT Hubの作成IoT Hubの作成は下記を参考に行っていきます。デバイスの登録まで手順通り行っていきます。サンプルプログラムサンプル...

可視化の方法はサンプルを利用します。

サンプルの確認

手順は以下の方法で行っていきます。Nodeアプリです。

learn.microsoft.com
チュートリアル - Web アプリで IoT データを視覚化する - Azure IoT Hub
https://learn.microsoft.com/ja-jp/azure/iot-hub/iot-hub-live-data-visualization-in-web-apps
このチュートリアルでは、Web アプリを使用して、センサーから収集されて IoT ハブに送信された気温と湿度のデータを視覚化します。

今回はWSLで作業を行っているため微妙にコマンドが異なります。

接続文字列、コンシュマーグループを確認したらexportコマンドで設定します。引用符で囲まないでくださいとありますが囲む必要があります。

export IotHubConnectionString="YourIoTHubConnectionString"
export EventHubConsumerGroup="YourConsumerGroupName"

データを送信している状態で npm start で起動します。

# npm start

> webapp@0.0.1 start
> node server.js

Using IoT Hub connection string [YourIoTHubConnectionString]
myconsumer
Using event hub consumer group [YourConsumerGroupName]
Listening on 3000.
Successfully created the EventHubConsumerClient from IoT Hub event hub-compatible connection string.
The partition ids are:  [ '0', '1', '2', '3' ]
Broadcasting data {"IotData":{"messageId":155,"deviceId":"Raspberry Pi Web Client","temperature":"28.3","humidity":"40.6"},"MessageDate":"2023-01-26T01:50:51.596Z","DeviceId":"mydevice"}

 

http://localhost:3000にアクセスします。

グラフが表示できることを確認します。

まとめ

可視化はサンプルを利用して簡単に行えます。サンプルを改変するとCo2などのデータも同じように可視化できます。

-Azure
-