IoT StudioでRaspberry piに基づいてワンストップ開発を試して見た(後編)

こんにちは!エンジニアの豹です。

前編ではIoT Studioで開発する時のプロセスを説明し、RGB LEDモジュールをRaspberry piに基づいてどうやってAlibaba Cloud IoT Platform連携するのか、モジュールの機能を発揮させるため、デバイス側の開発手法を紹介しました。

ご覧になりましたか?

今回は前編に続いて、温湿度センサーをRaspberry piに基づいてプロジェクトでの開発手法や、IoT StudioのWeb可視化アプリ開発ツールを使ってデバイスからのデータを収集します。そのデータをダッシュボードにリアルタイム表示されます。デバイス〜クラウドの間で双方向通信が行えますので、デバイスのコントロールも実現できます。

それでは本題に入りましょう。

温湿度センサー 開発ポロジェクト

IoT Platform側

開発プロジェクトの作成、プロダクトの作成、デバイスの作成等IoT Platform側で作ったものは前編にて細かく紹介したので、今回は割愛します。

回路を組む

今回利用したのはDHT11の温湿度センサー単体のものです。

ネット上で公開されているマニュアルを参考に回路図を組んでみました。

センサーのピン構成について、4つのピンがあります。

ピン ファンクション
pin#01 5V
pin#02 GPIO
pin#03 NC
pin#04 GND

pin#3は使用していないそうです。

回路の組み方は複数あるかと思いますが、個人的には下記のように組んでみました。

f:id:sbc_fengqi:20200331202753p:plain

簡単にまとめると、pin#01、pin#04にラズパイの5V、GNDを接続します。pin#02に任意のGPIOを割り当ててデータを取得します。

モジュールのインストール

今回使用するのはnode-dht-sensorです。
詳細:node-dht-sensor

ダウンロードし、インストールします。簡単ですね。

ソースコードを書く

pin#02には今回ラズパイのGPIO 14を接続します。

先ずはクラウドとの接続を考えずに機能検証ぐらいのプログラム書いて見た。

ソースコードは以下のような感じですが、

const sensor = require('node-dht-sensor');

const DHT11 = 11;
const data_pin = 14;

sensor.read(DHT11, data_pin, (err, temp, humid) => {
  if (err) return console.log('DHT11からデータを取得することができない(pin# :%d)', data_pin);
  console.log(new Date().toString());
  console.log('temperature: %d℃', temp);
  console.log('humidity: %d%', humid);
});

実行してみるとこんな感じです。

$ node index.js
Tue Mar 31 2020 12:10:17 GMT+0900 (Japan Standard Time)
temperature: 21℃
humidity: 60%

暖房している部屋かもしれません。温湿度の変化はあるけど緩い。

続いては、クラウドへの接続しましょう。

温湿度変化のトレンドを見たいので、 今回はRANDOM関数を使って温湿度のデータを擬似します。

node.jsファイルは以下となります:

const aliyunIot = require('aliyun-iot-device-sdk');
const device = aliyunIot.device({
productKey: "xxxxxxxxx", 
deviceName: "xxxxxxxxx",
deviceSecret: "xxxxxxxxxxxx"
});


device.on('connect', () => {
console.log('connect succesfully!');
const interval = setInterval(() => {

const t = Math.floor((Math.random() -0.5)*5+20);
const h = Math.floor((Math.random() -0.5)*10+70);
console.log(`Post current temperature: ${t}`);
console.log(`Post current humidity: ${h}`);
device.postProps({
CurrentTemperature: t,
CurrentHumidity: h
});
}, 5000);
});
device.on('error', (err) => {
console.log(err);
});

コンソールでnode index.jsを実行し、コンソールにてアップリンクのメッセージがプリントされます。

f:id:sbc_fengqi:20200331214020p:plain

それでは可視化Webアプリ開発に入ります。

可視化Webアプリケーション開発

プロジェクト作成

f:id:sbc_fengqi:20200331215221p:plain

基本手順

• コンポーネントの選択

f:id:sbc_fengqi:20200331220851p:plain
compo

今回はダッシュボードと折れ線グラフをそれぞれ二つ追加します。

• UIの設計

ブランクナビゲーションUIを使ってコンポーネントを見やすくように配置します。

• デバイスとの連携

f:id:sbc_fengqi:20200331221952p:plain

今回は連携について、イベントトリガーによってデバイスの属性の値を設定することでデバイスをコントロルすることが可能です。(DownLink Messege)

デバイス側で開発したプログラムにIoT Platform と接続して、データをアップデートします。そのデータをWeb可視化開発ツールでリアルタイムで表示されます。(UpLink Messege)

• 表示させたいデータを選択し、UIに表示することができます。

一定時間において、最終的な効果は以下となります:

f:id:sbc_fengqi:20200331220355p:plain

まとめ

Alibaba IoT Platformにおけるデバイスデータの収集から可視化までをカバーし、ワンストップで実行、デバッグ、パブリケーションができるIoT Studioに対して魅力を感じましたね。

興味がある方、ぜひ触ってみてください。

以上