ユニバーサル社会で役立つデザインや技術の研究
ラズパイ（Raspberry Pi 3 model B+）にサーモグラフィー「AMG8833」を取り付けました。もしobnizに取り付けようとして苦戦している場合、ラズパイに切り替えるのも手だと思います。
スイッチサイエンスで売られていたAMG8833搭載のモジュールを購入。
もともとはobnizで使う予定でした。
しかし、obnizのパーツライブラリでAMG8833については、「Adafruit社製以外のモジュールを使用する場合は注意してください。」とのことです。
スイッチサイエンスのモジュールは少し違い、センサー知識なしで使おうとするとハードルが高いです。
センサーを壊すと悲しいので、安全にラズパイを使います。
このセンサーの使い方は、「RaspberryPiで赤外線アレイセンサAMG8833(Grid-EYE)からデータ取得」を見ると、完璧に分かります。
温度データ8×8の配列を、取得することに成功しました。
次回、このデータをブラウザで読み込みます。
自宅でモルモットの温度管理にIoTを導入しています。しかし、目の前のホットカーペットの電源を入れるのに、アメリカと中国を経由する地球規模の仕組みは必要なのでしょうか？簡略化して再構築します。
Webサービス連携の「IFTTT」とスマートプラグ「Meross」を使って、モルモット・スマートホームを運用していました。
室温が下がったら、ホットカーペットの電源を入れる。
ただそれだけの仕組みなのですが、アメリカと中国を経由しているようです。正確にはどこのサーバーを経由しているのか分かりません。
モルモット・スマートホームを見直します。
ホットカーペットの電源をリレー回路でONにすることにしました。
室温に応じて電源のON／OFFを切り替えるくらいであれば、本来はインターネット不要です。
ただ、開発速度や管理のしやすさを考え、obnizは利用し続けることにします。
簡略化したら、設備追加したくなりました。湿度も管理できるように、加湿器を接続できるにします。
ホットカーペットと加湿器、２つの家電をリレーで制御します。写真では動作テストのため、スマホのブラウザで家電を操作しています。
実際は温度センサーを取り付けて、家電の電源管理を自動化します。
温度・湿度センサー「SHT20」を使うことにしました。
2つのリレーとSHT20、obnizへの接続は下記です。
IO 0・・・リレー1と2 GND
IO 1・・・リレー1と2 VCC
IO 2・・・リレー1 SIG（ホットカーペットのON／OFF）
IO 3・・・リレー2 SIG（加湿器のON／OFF）
IO 4・・・SHT20 GND
IO 5・・・SHT20 VCC
IO 6・・・SHT20 SDA
IO 7・・・SHT20 SCL
配線が完了したら、HTMLのJavaScriptで、スマートホームを運用します。ラズパイでブラウザを立ち上げっぱなしで運用している状態です。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 |
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>モルモットスマートホーム2.0</title> <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script> <script src="https://unpkg.com/obniz@3.11.0/obniz.js" crossorigin="anonymous"></script> <script src="hue-weather.js"></script> </head> <body> <div id="obniz-debug"></div> <main> <h1>モルモットスマートホーム</h1> </main> <script> const obniz = new Obniz("obnizID"); let isIO2 = false, isIO3 = false, nowM, oldM, temp, humid; obniz.onconnect = async () => { const sensor = obniz.wired("SHT20", {vcc: 5, sda:6, scl:7, gnd:4}); obniz.io0.output(false); obniz.io1.output(true); obniz.io2.output(false); obniz.io3.output(false); const timer = async () => { oldM = nowM; nowM = new Date().getMinutes() if(nowM % 30 === 0 && oldM % 30 !== 0){ //30分毎で処理 let t = await sensor.getTempWait().catch(e => { return temp; //前回の値代入 }); let h = await sensor.getHumidWait().catch(e => { return humid; //前回の値代入 }); //不正値の場合前回の値代入 if(t === -2){ t = temp; } if(h === -2){ h = humid; } temp = Math.round(t * 10) / 10; humid = Math.round(h * 10) / 10; console.log(temp + "℃", humid +"％"); checkData(temp, humid); } }; const checkData = async (t, h) => { // ホットカーペット if(t < 18 && !isIO2){ obniz.io2.output(true); isIO2 = true; }else if(t > 20 && isIO2){ obniz.io2.output(false); isIO2 = false; } // 加湿器 if(h < 40 && !isIO3){ obniz.io3.output(true); isIO3 = true; }else if(h > 45 && isIO3){ obniz.io3.output(false); isIO3 = false; } }; setInterval(timer, 30000); //30秒毎 }; </script> </body> </html> |
18℃未満でホットカーペットの電源ON。
湿度40%未満で加湿器ON。
これで、アメリカや中国のサーバーがダウンしても、モルモットは快適な生活が送れるでしょう。
木材にちょっとした穴を空けるとき、木工用ホールソーを使うと簡単です。インパクトドライバーに取り付けることができます。
私の持っている木工用ホールソーは、25mm～64mmの穴をあけられます。電動ドリルでは開けられないサイズの穴を空けたいときに使います。
ホールソーはホームセンターで売っており、Amazonでも1,000円くらいからセットで売られています。
ネジ回しなどで利用頻度の高いインパクトドライバーに取り付けられることが、ホールソーの良いところです。
わざわざ別の電動工具を用意せずに使えるので、作業がはかどります。
お勧めの工具の一つです。
前回作ったobnizの水位レーザーセンサーについて、土台の制作工程を記載します。ただの一例で、手元にある材料で工夫して組み立てるのがベストです。
obnizと、センサーを取り付ける土台を作ります。
適当な木材にホールソーで穴を空け、給水ボトルが通るようにします。
木材はobnizの幅で、カットします。
カットした木材にネジ穴を空け、スペーサーを立てます。
obniz+受光センサーを設置する場所と、対面のレーザーモジュールを設置する場所、2か所に2本ずつスペーサーを立てました。
ネジ、スペーサーはよく使うので、常備しておくと便利です。
obniz+受光センサーをネジで固定。反対側もレーザーモジュールを固定します。
USBケーブルがモルモットのケージと逆側になるようにします。
ケーブルをかじられてしまうかもしれません。
たまたま３DプリントしたGoProジョイントがあったので、木材の裏に取り付けて、三脚に接続しました。
もしフックがあれば、ケージにひっかけて固定する方法が楽だと思います。
obnizの配線やプログラミングは前回の記事を参照してください。
動作検証が済んだら、この土台は分解して、モルモットのかじり木としてあたえることとします。
モルモットの給水ボトル。水が少なくなったら通知する仕組みをobnizで作りました。水位センサーは使わず、レーザーと感光センサーを利用しています。
衛生面が気になり、水にセンサーを入れず、水位を知る方法を考えます。
方法としては、ボトルの重さを測ったり、画像認識で解析したり、光で測ったり・・・いくつかありそうです。
今回は最も簡単そうな、レーザーと感光センサーを用いる方法を試します。
光の屈折を利用します。
水が入っている状態のボトルでは、レーザーが屈折して、感光センサーに光が当たらないようにします。
そして水がなくなったら、レーザーが直進して感光センサーが反応するようにします。
目論見通りに水位を測れるか、まずは試作してみます。
obniz、レーザー、受光センサー、そして家にあった木材やネジで組み立てました。
レーザーは水位を測る時、瞬間的に照射すればよいので、通常はOFFにしています。
タイマーで10分毎にレーザーを放ち、計測するようにしました。
実際の挙動です。ボトルの水が少ない状態。
レーザーを0.1秒照射して赤く光った後、ブラウザに「水がないよ！」という通知が来ました。
ちなみに音声で「水がないよ！」と、しゃべっています。
今度はボトルに水を入れた状態です。
レーザー照射後、ブラウザの表示が「水あるよ」に戻りました。
obnizボードの配線は下記のようにしました。
IO 6ピン・・・レーザーVCC
IO 8ピン・・・レーザーGND
IO 9ピン・・・感光センサーVCC
IO10ピン・・・感光センサーGND
IO11ピン・・・感光センサーデジタル入力
試作したHTMLでは、音声通知にWeb Speech APIを使っています。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 |
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>モルモット水残量</title> <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script> <script src="https://unpkg.com/obniz@3.11.0/obniz.js" crossorigin="anonymous"></script> </head> <body> <div id="obniz-debug"></div> <main> <h1>モルモット水残量</h1> <button type="button">音声お知らせOFF</button> <p id="val" style="font-size:100px;">計測待ち・・・</p> </main> <script> const obniz = new Obniz("obnizID"); const $val = $('#val'); let isSpeech = false, uttr; $('button').on('click', function() { let text; if(isSpeech){ text = "音声お知らせOFF"; isSpeech = false; }else{ text = "音声お知らせON"; isSpeech = true; } $(this).text(text); uttr = new SpeechSynthesisUtterance(text); speechSynthesis.speak(uttr); }) obniz.onconnect = async () => { let text; obniz.io8.output(false); obniz.io10.output(false); const timer = async () => { const sleep = msec => new Promise(resolve => setTimeout(resolve, msec)); let val; await obniz.io6.output(true); await obniz.io9.output(true); await sleep(100); val = await obniz.io11.inputWait(); obniz.io6.output(false); obniz.io9.output(false); if(val){ text = "水あるよ"; }else{ text = "水ないよ！"; } if(isSpeech){ uttr = new SpeechSynthesisUtterance(text); speechSynthesis.speak(uttr); } $("#val").text(text); }; setInterval(timer, 1000 * 60 * 10);//10分毎 }; </script> </body> </html> |
実運用ではブラウザのタイマーより、obnizのサーバレスイベントに登録して実行したほうが良いでしょう。
ただ、サーバレスイベントだと当然、Web Speech APIは使えません。
代案として、IFTTTで水が少なくなったらLINEに通知する方法や、obnizボードに直接ブザーを付けて鳴らす方法などが考えられます。
自分のライフスタイルに合わせ、気づきやすい方法で知らせるのが良いかと思います。
最後に余談ですが、モルモットは何か欲しい時、「キューイ！キューイ！」と大きな声で鳴きます。
在宅中はブザーがなくても、水がないことをモルモット自身が教えてくれるかもしれません・・・。
obnizでレーザー遮断センサーを作りました。以前も遮断センサーを作ったことがありますが、今回はジャンパーワイヤーが届く短距離で、より簡単に作ります。
レーザー遮断センサーを作るときは、レーザーモジュールと感光センサーモジュールを利用したほうが楽です。
光センサー（Cdsセル）やレーザーが基盤にのっかているモジュールで、obnizに直接挿したり、ジャンパーワイヤーを使えたり、抵抗を付ける必要がなかったり、圧倒的に開発が簡単になります。
感光センサーにレーザーが当たったら「true」、当たってなかったら「false」をブラウザで受け取るようにしました。
遮断センサーを作る場合、感光センサーがレーザーを常に受光するように固定します。
何か障害物によってレーザーを遮断すると、プログラムが実行する仕掛けとなっています。
もし、レーザーを当てなくても、部屋の明かりで感光センサーが反応してしまう場合、ドライバーで青いボックスのネジを回すと、光の感度を変更できます。
手軽に調整できるのが、感光センサーモジュールの良いところです。
obnizを利用した遮断センサーのコードです。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>レーザー遮断センサー</title> <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script> <script src="https://unpkg.com/obniz@3.11.0/obniz.js" crossorigin="anonymous"></script> </head> <body> <div id="obniz-debug"></div> <main> <h1>レーザー遮断センサー</h1> <table> <tr> <th>光</th> <td id="val" style="font-size:100px;"></td> </tr> </table> </main> <script> const obniz = new Obniz("obnizID"); const $val = $('#val'); obniz.onconnect = async () => { //受光センサー obniz.io0.output(true); obniz.io1.output(false); obniz.io2.input(function(val){ val = !val; $("#val").text(val); }); //レーザー obniz.io3.output(true); obniz.io5.output(false); }; }; </script> </body> </html> |
受光センサーモジュールをIOピン0～2、レーザーモジュール3～5に挿しています。
上記HTMLにobnizIDを入れて、適当なHTML名で保存してブラウザで起動すれば、遮断センサーの出来上がりです。
２つのスマートライト「Hue」で、天気予報をお知らせします。天気情報はOpenWeatherのAPIを使っています。
天気情報を取得できるOpenWeatherのAPIがあります。アカウント登録をすると無料で天気データのJSONを受け取ることができます。（1分間に60リクエストまで）
アカウント登録方法、各種設定についてはネット上に多くの情報があり、ここでは多く書きません。
今回は東京の3時間ごとの天気予報を、下記URLで取得します。
http://api.openweathermap.org/data/2.5/forecast?id=1850147&units=metric&cnt=2&appid=<取得したid>
私はあまり出かけないので3～6時間後の天気を知れればそれでよいです。
JavaScriptで定期的にAPIを呼んで、天気予報をHueの色に変換して伝えます。
※１ 雲が多いほど彩度・明度が下がり、白っぽく暗くなります。
※２ 降水量が多いほど彩度・明度が上がり、鮮やかで明るい水色になります。
動作はブラウザとローカルのHTMLファイルで、簡単に試せます。
jQueryでHueを操作する方法はこちらをご確認ください。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 |
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>天気予報をHueで伝える</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <script> $(function(){ var getWeather = function(){ $.ajax({ url: "http://api.openweathermap.org/data/2.5/forecast?id=<OpenWeatherID>", cache: false, success: function(data){ setColor(data.list[0], 1); //0～3時間後の天気, Hueライトの番号 setColor(data.list[1], 2); //3～6時間後の天気, Hueライトの番号 } }); }, setColor = function(data, n){ var hsv = [], s = 100, v = 100, w = data.weather[0].main, c = data.clouds.all, r = data.rain; if(w === "Clear"){ //快晴 s *= 2; v *= 2, hsv = [6000, s, v]; }else if(w === "Clouds"){ //曇り s = (s - c) * 2; //雲が多いほど彩度が下がる v = v * 2 - c; //雲が多いほど明度が下がる hsv = [8000, s, v]; }else if(w === "Rain" || w === "Thunderstorm" || w === "Drizzle"){ //雨・雷雨・霧雨 if(r){ r = r["3h"]; }else{ r = 0; } s += s * r; //雨が多いほど彩度が上がる v += v * r; //雨が多いほど明度が上がる hsv = [40000, s, v]; }else if(w === "Snow"){ //雪 hsv = [50000, s, v]; }else{ //その他 竜巻とか砂埃とか hsv = [0, 0, v]; } putHue(hsv, n); }, putHue = function(hsv, n){ var json = JSON.stringify({"on":true, "hue": hsv[0], "sat": hsv[1], "bri": hsv[2]}); $.ajax({ url: 'http://<HueブリッジIP>/api/<Hueユーザーネーム>/lights/' + n + '/state', method: 'PUT', headers: {'Content-Type':'application/json'}, data: json, success: function(result) { console.log(result); } }); }; getWeather(); }); </script> </body> </html> |
もし、稼働しっぱなしのPCやラズパイがあれば、setintervalなどで定期的に上記JavaScriptを実行することで、天気予報のHueライトが更新されていきます。
スマートライト「Hue」。ローカルのブラウザでjQueryを使って簡単に操作できます。やってみれば簡単ですが、毎回やり方を忘れて調べることになります。また、HueにjQueryを使おうとする記事がほぼないので、ここに書き留めます。
前程として、Hueブリッジが必要です。また、公式アプリでHueライトの動作確認が済んでいる状態で話を進めます。
Hueをローカルから制御するには、HueブリッジのAPIを発行します。
http://0.0.0.0/api/XXXXXXXX/lights/1/state/
上記のようなアドレスに、{“on”:true} というようなJSONを送ると、ライトがONになります。
まずはHueブリッジのIPアドレスを調べます。
https://discovery.meethue.comへアクセスすると、”internalipaddress”:”0.0.0.0″というような、HueブリッジのIPアドレスが表示されます。
ここから先は、公式ページのHow to develop for Hue? Step 3に沿って進めたほうが確実です。
Googleページ翻訳でだいたい意味は分かり、このページに沿って設定するのが最速でした。
1点だけ、途中にHueブリッジの物理ボタンを押す必要があるので、注意が必要です。PCの画面のボタンではなく、ブリッジのボタンです。
Go and press the button on the bridge and then press the POST button again and you should get a success response like below.
APIを発行出来たら、{“on”:true} というようなHueライトの状態を書いたJSONをPUTします。Web制作でPUTメソッドを使う機会はほぼなく、ブラウザによっては問題が起こりそうなので、jQueryに頼ります。
適当なHTML（test.htmlなど）をローカルに作りましょう。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<html> <head> <meta charset="utf-8"> <title>Hue Test</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <script> $(function(){ var json = JSON.stringify({"on":true, "sat":154, "bri":154,"hue":1000}); console.log(json) $.ajax({ url: 'http://<ip address>/api/<username>/lights/1/state', method: 'PUT', headers: {'Content-Type':'application/json'}, data: json, success: function(result) { console.log(result); } }); }); </script> </body> </html> |
13行目のurlは、先ほど調べたAPIのurlに書き換えてください。
また、もしHueライトを複数持っている場合、/lights/の後の数字を変えてみてください。Hue公式アプリで登録順に数字がふられていると思います。一つしかなければ/lights/1です。
書き換えが完了したら、このHTMLをブラウザで開きます。
するとHueライトが赤色に変わります。
APIにJSONをPUTするだけ。分かってしまうと、簡単です。
ブラウザのJavaScriptで、自由にライトを操作できるようになりました。
10分間隔でスプレッドシートに温度・湿度を記録するJavaScriptを作りました。しかし、なぜか途中から5分前後の間隔で記録されています。ラズパイ３のブラウザでsetInterval()を使ったときに起こりました。
温度センサーで取得した値を、obniz経由でラズパイ３のブラウザChromiumに表示させています。
タイマー処理はラズパイのブラウザ上で動作しています。
ブラウザのJavaScriptで、10分間隔で何か実行する場合、下記のような記述方法があります。
|
1 2 3 4 5 |
const timer = () => { // 実行する命令 }; setInterval(timer, 1000 * 60 * 10);//10分毎 |
setInterval()で、10分（＝600,000ミリ秒）ごとに実行する書き方です。
ラズパイを放置していたら、3時間後に突然大きなズレが発生していました。ちなみにラズパイはディスプレイをつないでいない状態です。
冒頭のスプレッドシートを再掲します。
開始3時間は10分間隔でしたが、その後5分前後の間隔になっています。
理由は分かりません。
ラズパイ３か、ブラウザが省電力モードに入ったのかもしれません。
処理速度が落ちて間隔が伸びるのかなと考えていましたが、逆に縮まるようです。
解決策として、現在時刻の分が10で割りきれる数（例えば1:00, 1:10, 1:20, 1:30, 1:40, 1:50）の時だけ実行するようにします。
|
1 2 3 4 5 6 7 8 9 10 11 |
let nowM, oldM; const timer = () => { oldM = nowM; nowM = new Date().getMinutes() if((nowM % 10 === 0 && oldM % 10 !== 0)){ //10分毎で処理 //実行する命令 } }; setInterval(timer, 30000); //時刻チェックは30秒毎 |
1分間に2回処理しないよう、前回から分が変わっている時だけ実行するようにしました。（もっと良い書き方があるかもしれません。）
このコードであれば、3時間以降でもだいたい10分間隔で実行してくれます。
ラズパイのブラウザを起動しっぱなしで温度を記録しようとするのはレアケースだと思いますが、参考になる人がいれば・・・。
obnizのパーツライブラリにある温度・湿度センサー「SHT20」。パーツライブラリ以外にあまり情報がないので、起こったトラブルとその対処法を記録に残します。
SHT20は、Amazonで900円くらいで買えます。
ピンのはんだ付けは必要でした。
SHT20のピンは4本ですが、サンプルコードでは6本指定があります。
|
1 |
var sensor = obniz.wired("SHT20", {vcc : 0, sda:1, scl:2, adr:3, gnd:4, addressmode:5}); |
adrとaddressmodeは、指定しなくても問題なく動作しました。
温度、湿度を定期的に取得していると、たまに下記のエラーが発生します。
i2c0: writing error. Communication Failed. Maybe, target is not connected.
エラーは大きく2パターンあり、数値を取得できない場合と、-2で取得する場合です。
特に気温-2度は、ありえる数字なので要注意です。
使う場面で対処は異なりますが、今回はエラーや不正値の場合、前回の値を代入する対処とします。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
const obniz = new Obniz("obnizID"); let temp, humid; obniz.onconnect = async () => { const sensor = obniz.wired("SHT20", {vcc: 0, sda:1, scl:2, gnd:3}); const timer = async () => { let t = await sensor.getTempWait().catch(e => { return temp; //前回の値代入 }); let h = await sensor.getHumidWait().catch(e => { return humid; //前回の値代入 }); //不正値の場合前回の値代入 if(t === -2){ t = temp; //前回の値代入 } if(h === -2){ h = humid; //前回の値代入 } temp = Math.round(t * 10) / 10; humid = Math.round(h * 10) / 10; console.log(temp, humid) }; setInterval(timer, 1000 * 60 * 10);//10分毎 }; |
sensor.get・・・でエラーがでたら前回の値代入。
これだけでは解決せず、-2と取得することがあります。
センサーで取得する気温や湿度の値は、少数点15位くらいまであり、-2ピッタリになることはまずありえません。
もし、-2だった場合も、前回の値を代入することにしました。
まだエラーが発生しました。
まれに、気温が「53.1℃」とか、湿度「96.8％」とか、異常に高い数値を取得してしまいます。
window.onerrorで、ブラウザがエラーを感知した時、前回の値を代入するように追記して、様子をみます。