2020年12月 – ページ 2 – てまりのユニバーサルデザイン

2020年12月21日2020年12月22日

micro:bit加速度センサーをブラウザで可視化

micro:bitを利用して、爆破スイッチを作りました。まずはmicro:bitの加速度センサーをPCブラウザで読み込む部分のプログラムを作ります。

ブラウザで棒の傾きを可視化

分かりやすいように、micro:bitを取り付けた棒の傾きを可視化してみます。

検証はchromeブラウザ（フルスクリーン）で行っています。

micro:bitからブラウザで加速度を取得するところまでは、パソコン工房のmicro:bitで始めるプログラミング入門［Bluetoothでコントローラー編］で勉強させて頂きました。

micro:bitのプログラム

まずはmicro:bitでビジュアルプログラミングです。

micro:bitでは、bluetooth通信を簡単に設定できます。

パソコン工房に設定の仕方は詳しく書かれており、ここでは割愛します。

最低限だと「最初だけ＞bluetooth 加速度計サービス」でおしまいです。

分かりやすいよう、接続状況にによってmicro:bitのアイコンが変わるようにします。

ブラウザのプログラム

bluetoothで加速度の値を受け取るプログラムをHTMLに書きます。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Angle</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style media="screen">

  body {
    background-color: #000;
  }

  #controller {
    position: relative;
    width: 480px;
    height: 480px;
    margin: auto;
  }

  #lever {
    width: 40px;
    height: 480px;
    margin-left: 220px;
    border: #FFF solid 2px;
    box-sizing: border-box;
    background-color: #000;
  }

  #connect {
    margin: 20px;
    padding: 5px 20px;
    font-size: 20px;
  }
</style>
</head>

<body>

<div id="controller">
  <div id="lever"></div>
</div>

<button id="connect">接続</button>

<script>
$(function(){
  let $lever = $('#lever');

  setAngle = (angle) => {
    $lever.css("transform", "rotateZ("+angle+"deg)");
  };

  $('#connect').on('click',function(){
    connect();
  });

  // 加速度UUID ※以下https://www.pc-koubou.jp/magazine/12416参考
  const ACCELEROMETER_SERVICE_UUID = 'e95d0753-251d-470a-a062-fa1922dfa9a8';
  const ACCELEROMETER_CHARACTERISTICS_UUID = 'e95dca4b-251d-470a-a062-fa1922dfa9a8';

  let microbit = null;

  function connect(){
    console.log('connect');
    let options = {};

    // BLEデバイスをスキャンする
    navigator.bluetooth.requestDevice({
      filters: [{
        namePrefix: 'BBC micro:bit'
      }],
      optionalServices: [ACCELEROMETER_SERVICE_UUID]
    })
    .then(device => {
      console.log(device);
      microbit = device;
      return device.gatt.connect();
    })
    .then(server => {
      console.log(server);
      return server.getPrimaryService(ACCELEROMETER_SERVICE_UUID);
    })
    .then(service => {
      console.log(service);
      return service.getCharacteristic(ACCELEROMETER_CHARACTERISTICS_UUID);
    })
    .then(characteristic => {
      console.log(characteristic);
      characteristic.startNotifications();
      characteristic.addEventListener('characteristicvaluechanged', accelerometerChanged);
    })
    .catch(error => {
      console.log(error);
    });

    function accelerometerChanged(event){
      // 加速度X座標
      let //accelX = event.target.value.getInt16(0, true)/1000.0,
          accelY = event.target.value.getInt16(2, true)/1000.0,
          accelZ = event.target.value.getInt16(4, true)/1000.0;
      // 角度
      setAngle(Math.atan2(accelZ, accelY) * (180.0 / Math.PI));
    }
  }
});

</script>
</body>
</html>

100

101

102

103

104

105

106

107

108

109

110

<!DOCTYPE html>

<html>

<head>

<title>Angle</title>

body {

background-color: #000;

}

#controller {

position: relative;

width: 480px;

height: 480px;

margin: auto;

}

#lever {

width: 40px;

height: 480px;

margin-left: 220px;

border: #FFF solid 2px;

box-sizing: border-box;

background-color: #000;

}

#connect {

margin: 20px;

padding: 5px 20px;

font-size: 20px;

}

</style>

</head>

<body>

</div>

$(function(){

let $lever = $('#lever');

setAngle = (angle) => {

$lever.css("transform", "rotateZ("+angle+"deg)");

};

$('#connect').on('click',function(){

connect();

});

// 加速度UUID ※以下https://www.pc-koubou.jp/magazine/12416参考

const ACCELEROMETER_SERVICE_UUID = 'e95d0753-251d-470a-a062-fa1922dfa9a8';

const ACCELEROMETER_CHARACTERISTICS_UUID = 'e95dca4b-251d-470a-a062-fa1922dfa9a8';

let microbit = null;

function connect(){

console.log('connect');

let options = {};

// BLEデバイスをスキャンする

navigator.bluetooth.requestDevice({

filters: [{

namePrefix: 'BBC micro:bit'

}],

optionalServices: [ACCELEROMETER_SERVICE_UUID]

})

.then(device => {

console.log(device);

microbit = device;

return device.gatt.connect();

})

.then(server => {

console.log(server);

return server.getPrimaryService(ACCELEROMETER_SERVICE_UUID);

})

.then(service => {

console.log(service);

return service.getCharacteristic(ACCELEROMETER_CHARACTERISTICS_UUID);

})

.then(characteristic => {

console.log(characteristic);

characteristic.startNotifications();

characteristic.addEventListener('characteristicvaluechanged', accelerometerChanged);

})

.catch(error => {

console.log(error);

});

function accelerometerChanged(event){

// 加速度X座標

let //accelX = event.target.value.getInt16(0, true)/1000.0,

accelY = event.target.value.getInt16(2, true)/1000.0,

accelZ = event.target.value.getInt16(4, true)/1000.0;

// 角度

setAngle(Math.atan2(accelZ, accelY) * (180.0 / Math.PI));

}

});

</script>

</body>

</html>

私がmicro:bitの傾きで取得したかったのは、加速度YとZで求める角度でした。

Math.atan2(accelZ, accelY) * (180.0 / Math.PI)

1	Math.atan2(accelZ, accelY) * (180.0 / Math.PI)

accelZ、accelYは、どの軸の角度を取得したいかによって入れ替えます。

ブラウザで実行

ローカルでお手軽に動作します。

上記のHTMLをブラウザで開き、接続ボタンを押すと、ペアリング設定が始まります。

接続可能なmicro:bit一覧が表示されるので、選択し、ペア設定ボタンを押します。

そして数秒後に加速度の取得が始まり、ブラウザに表示された棒が動くようになりました。

この技術を使い、完成させた爆破スイッチのコードを次回掲載します。

2020年12月20日2020年12月22日

micro:bitで爆破スイッチ

micro:bitを使って爆破スイッチを作ります。長男がレバースイッチを作っており、これと連動して爆発するプログラムを作りました。

段ボールでレバースイッチを工作

長男が段ボールでレバースイッチを作っています。

持ち手と反対側にmicro:bitが取り付けてあり、加速度でレバーの傾きを取得できます。

箱の中には丸い割りばしが刺さっていて、回転軸となっていました。

箱をふさいで、レバースイッチ完成のようです。

爆破のプログラミング

レバースイッチを見ていたら、爆破スイッチにしたくなりました。

レバーを押し込んだときに、爆発するようにします。

micro:bitの加速度をBLEでPCに飛ばします。PCでレバーの角度を計算して、押し込まれたら爆発の画像を表示しています。

そして、壁にプロジェクターで映し出しました。

次回、micro:bitとHTML（JavaScript）のプログラミングを掲載します。

2020年12月19日2020年12月20日

obniz Board 1Yを電池で動かす

「obniz Board 1Y」を電池で動かします。単３電池３つで動きますが、消費を抑えるためスリープは必須です。

ボードに電源の差し込み口あり

「obniz Board 1Y」には、3.3Vと書かれた電源差し込み口があります。

このボードは仕様上、動作電圧範囲がDC3.3～5.5Vで、3.3V以上の電池をつなげば動くはずです。

手元にあるエネループは１つ1.2V。３本で3.6V。

つないでみると問題なく稼働しました。

スリープと併用が必須

電池で長期間可動させる場合、スリープが必須です。

以前、10分おきの温度記録を行った際、3200mAhのモバイルバッテリーが2日で空になりました。

単三電池3つ（6000mAhくらい）でも、4日で空になる計算です。

長期運用の場合スリープを前提に構築

モルモットのスマートホームをスリープなしで構築してしまいました。

電源につなぎっぱなしでの稼働だと、無駄に電力を消耗してしまいます。

当たり前ですが長期運用する場合、スリープを考えてプログラミングする必要でした・・・。

2020年12月18日2020年12月18日

obnizサーバーレスイベントの制限は9時解除？

obnizドキュメントによると、サーバーレスイベントの実行は1日に150回までとなっています。しかし日付が変わっても解除されず、朝9時ごろの解除でした。obnizのいう1日とはイギリスの標準時が基準なのでしょう。

なぜか今日の実行回数が150回に達する

10分おきにサーバーレスイベントを実行すると、1日144回となります。

しかし・・・なぜか朝の9:30に、150の上限に達してしまいました。

まだ1日は始まったばかりです。

エクセルにログの時間を貼り付けて確認してみると、不思議な結果となりました。

24時間以上カウントされている

9:05から翌日の9:30で150回に達していました。

1日が24時間超えているようです。

あと、1日の始まりが9時なので、イギリスの標準時が基準のようです。（日本との時差9時間）

1日の終わりは9時ではないようなので、注意が必要です。

24時間作動しなくなる

もう一つの注意点が、上限に達すると24時間作動しなくなることです。

おそらくですが、前日のカウントがリセットされないまま、今日のカウント判断が実行され、即、上限に達したからだと思います。

これは2020年12月現在の挙動で、近いうちに修正されるかもしれません。

2020年12月17日2020年12月17日

obnizからスプレッドシートに温度を記録

前回のモルモットスマートホームに、スプレッドシートを追加しました。部屋の温度がどう推移しているか、グラフで分かります。スプレッドシートはサーバー化してobnizから直接温度データを受信できます。

スプレッドシートの出力結果

先にスプレッドシートの出力結果を掲載します。

10分間隔で、スプレッドシートに日時、温度、湿度が記入されていきます。（プログラムのミスで、最初は1秒間隔で記入されています。）

ただ、よく見ると記入されていない時間もあります。

15時台は3回しか記入がなく、半分は失敗しているようです。13時台のように6回全部記入されることもあります。

これは、obnizとスプレッドシート間の問題ではなく、温度を計測しているμPRISMセンサーとobnizのBLE通信が不安定なことが原因のようです。

温度を確実に記録したい場合、obnizに温度センサーを直接つないでください。

温度管理の全体図

前回までの構成に、スプレッドシートを追加しました。

μPRISMセンサーで温度を測りobnizに飛ばす。
obnizで温度を判定し、IFTTTに指示を送る。と、同時にスプレッドシートに温度を書き込む。
IFTTTからMerossスマートプラグを操作して、ホットカーペットの電源を切り替える。

スプレッドシートをサーバーに

温度データをスプレッドシートに書き込む方法は、obniz公式ブログにあります。IFTTTを介してスプレッドシートに書き込むのが、手軽な方法だと思います。

しかし、IFTTTは2020年9月から、無料で作れるアプレットの数が３つに制限されてしまいました。

ならばIFTTTを介さず、直接obnizからスプレッドシートに書き込めるようにしましょう。

スプレッドシートを簡易サーバーにします。

スプレッドシートのGAS

Google Spreadsheet を簡易 Webサーバーとして動かして、手軽にWebHookを受け取る方法を参考にしました。

私はPOSTでJSONを送るとき、CORS（クロスドメインエラー）に悩まされ、あきらめてkey=valueの形式で、データ送受信をすることにしました。

下記が、GASに記載したコードです。

function doPost(e) {
  let ss = SpreadsheetApp.getActive(),
      sheet = ss.getActiveSheet(),
      data = [new Date()],
      contents = e.postData.contents.split("&");
  for(let i=0;contents[i];i++) {
    let kv = contents[i].split('=');
    data[i+1]=kv[1];
  }
  sheet.appendRow(data);
}

function doPost(e) {

let ss = SpreadsheetApp.getActive(),

sheet = ss.getActiveSheet(),

data = [new Date()],

contents = e.postData.contents.split("&");

for(let i=0;contents[i];i++) {

let kv = contents[i].split('=');

data[i+1]=kv[1];

}

sheet.appendRow(data);

}

Postデータを受け取ったら、シートの最後の行にデータを追加していきます。

obnizのコード

温度、あと湿度のデータをPostしているobnizのコードです。

<html>
<head>
  <meta charset="utf-8">
  <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>
<script>
const obniz = new Obniz("obniz-ID");
const ifttt_secret_key = "IFTTT-ID";
let isWrit = false;

obniz.onconnect = async () => {
  await obniz.ble.initWait();
  const U_PRISM = Obniz.getPartsClass("uPRISM");
  obniz.ble.scan.onfind = async (peripheral) => {
    if (U_PRISM.isDevice(peripheral)) {
      console.log("μPRISM発見");
      const device = new U_PRISM(peripheral);
      device.ondisconnect = (reason) => {
        console.log(reason)
      }
      await device.connectWait();
      console.log("μPRISM接続完了");
      device.onNotify =  async (r) => {
        if(!isWrit){
          const temp = r.temperature.toFixed(1);
          const humid = r.humidity.toFixed(1);

          isWrit = true;

          postData = (url, data) => {
            fetch(
              url,
              {
                method: "POST",
                mode: "no-cors",
                body: data
              }
            )
            .then(() => console.log(url + "にPOST成功"))
            .catch(error => console.log(error));
          };

          if(r.temperature < 18){
            await postData('https://maker.ifttt.com/trigger/run_meross/with/key/' + ifttt_secret_key, "");
          }else if(r.temperature > 20){
            await postData('https://maker.ifttt.com/trigger/stop_meross/with/key/' + ifttt_secret_key, "");
          }
          await postData("スプレッドシートで発行したURL", `temp=${temp}&humid=${humid}`);
          await obniz.wait(1000);
          if (typeof done === "function") {
            done();
          }
        }

      };
      await device.startNotifyWait();
    }
  };
  await obniz.ble.scan.startWait();

}

</script>
</body>
</html>

<html>

<head>

</head>

<body>

const obniz = new Obniz("obniz-ID");

const ifttt_secret_key = "IFTTT-ID";

let isWrit = false;

obniz.onconnect = async () => {

await obniz.ble.initWait();

const U_PRISM = Obniz.getPartsClass("uPRISM");

obniz.ble.scan.onfind = async (peripheral) => {

if (U_PRISM.isDevice(peripheral)) {

console.log("μPRISM発見");

const device = new U_PRISM(peripheral);

device.ondisconnect = (reason) => {

console.log(reason)

}

await device.connectWait();

console.log("μPRISM接続完了");

device.onNotify = async (r) => {

if(!isWrit){

const temp = r.temperature.toFixed(1);

const humid = r.humidity.toFixed(1);

isWrit = true;

postData = (url, data) => {

fetch(

url,

{

method: "POST",

mode: "no-cors",

body: data

}

)

.then(() => console.log(url + "にPOST成功"))

.catch(error => console.log(error));

};

if(r.temperature < 18){

await postData('https://maker.ifttt.com/trigger/run_meross/with/key/' + ifttt_secret_key, "");

}else if(r.temperature > 20){

await postData('https://maker.ifttt.com/trigger/stop_meross/with/key/' + ifttt_secret_key, "");

}

await postData("スプレッドシートで発行したURL", `temp=${temp}&humid=${humid}`);

await obniz.wait(1000);

if (typeof done === "function") {

done();

}

};

await device.startNotifyWait();

}

};

await obniz.ble.scan.startWait();

}

</script>

</body>

</html>

Postしているデータはtemp=${temp}&humid=${humid}の部分です。

tempが温度、humidが湿度。時刻はスプレッドシート側で記述されます。

このコードを、obnizのサーバーレスイベントで10分おきに実行しています。

送信ログ

obnizのサーバーレスイベント画面で、実行ログを見られます。

スプレッドシートに向けてPostした後にエラーが出ていますが・・・、不都合がなかったのでこのまま運用します。

スプレッドシートでグラフ化

スプレッドシートのA～C列（時間、温度、湿度）を全選択します。

メニューから挿入＞グラフを選択すれば、常に更新されていくグラフとなります。

モルモットの温度管理が可視化されました。

2020年12月16日2020年12月16日

obnizサーバーレス・スマートホーム

モルモットが快適に過ごすスマートホームを作っています。寒くなったら自動的にホットカーペットをONにします。前回はブラウザで動かしていましたが、実用的にするためobnizのサーバーレスイベントを利用します。

モルモットの生活が常に快適に

18℃を下回ると、モルモットのケージの下のホットカーペットが、自動でONになります。

人間よりモルモットを丁重に扱っている状態に、妻はあきれていました。

この仕組みはブラウザのJavaScriptで動作していましたが、それではPCを閉じたら動かないため、obnizのクラウド上で動かします。

調べると、obnizクラウドには、登録したイベントを自動的に実行する「サーバーレスイベント」があるようです。

モルモットスマートホーム全体図

前回パソコンだったものが、obnizクラウドに差し替わりました。

その他、μPRISMセンサーやmerossなどは前回の記事に掲載しています。

サーバーレスイベントは、10分おきで繰り返しに設定しました。

パソコンなしで、10分おきに温度をチェックして、寒ければホットカーペットのスイッチがONになり、暑ければOFFになります。

なお、持っているのが「obniz Board 1Y」なら、タイマーではなく公式ブログに書かれている方法で設定したほうが省電力です。

実行しているコード

<html>
<head>
  <meta charset="utf-8">
  <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>
<script>
const obniz = new Obniz("obniz-ID");
const ifttt_secret_key = "IFTTT-ID";
let isWrit = false;

obniz.onconnect = async () => {
  await obniz.ble.initWait();
  const U_PRISM = Obniz.getPartsClass("uPRISM");
  obniz.ble.scan.onfind = async (peripheral) => {
    if (U_PRISM.isDevice(peripheral)) {
      console.log("μPRISM発見");
      const device = new U_PRISM(peripheral);
      device.ondisconnect = (reason) => {
        console.log(reason)
      }
      await device.connectWait();
      console.log("μPRISM接続完了");
      device.onNotify =  async (r) => {
        const temp = r.temperature.toFixed(1);
        const humid = r.humidity.toFixed(1);

        postData = (url, data) => {
          fetch(
            url,
            {
              method: "POST",
              mode: "no-cors",
              body: data
            }
          )
          .then(() => console.log(url + "にPOST成功"))
          .catch(error => console.log(error));
        };

        if(r.temperature < 18){
          await postData('https://maker.ifttt.com/trigger/run_meross/with/key/' + ifttt_secret_key, "");
        }else if(r.temperature > 20){
          await postData('https://maker.ifttt.com/trigger/stop_meross/with/key/' + ifttt_secret_key, "");
        }
        await obniz.wait(1000);
        if (typeof done === "function") {
          done();
        }

      };
      await device.startNotifyWait();
    }
  };
  await obniz.ble.scan.startWait();
}

</script>
</body>
</html>

<html>

<head>

</head>

<body>

const obniz = new Obniz("obniz-ID");

const ifttt_secret_key = "IFTTT-ID";

let isWrit = false;

obniz.onconnect = async () => {

await obniz.ble.initWait();

const U_PRISM = Obniz.getPartsClass("uPRISM");

obniz.ble.scan.onfind = async (peripheral) => {

if (U_PRISM.isDevice(peripheral)) {

console.log("μPRISM発見");

const device = new U_PRISM(peripheral);

device.ondisconnect = (reason) => {

console.log(reason)

}

await device.connectWait();

console.log("μPRISM接続完了");

device.onNotify = async (r) => {

const temp = r.temperature.toFixed(1);

const humid = r.humidity.toFixed(1);

postData = (url, data) => {

fetch(

url,

{

method: "POST",

mode: "no-cors",

body: data

}

)

.then(() => console.log(url + "にPOST成功"))

.catch(error => console.log(error));

};

if(r.temperature < 18){

await postData('https://maker.ifttt.com/trigger/run_meross/with/key/' + ifttt_secret_key, "");

}else if(r.temperature > 20){

await postData('https://maker.ifttt.com/trigger/stop_meross/with/key/' + ifttt_secret_key, "");

}

await obniz.wait(1000);

if (typeof done === "function") {

done();

}

};

await device.startNotifyWait();

}

};

await obniz.ble.scan.startWait();

}

</script>

</body>

</html>

「await」で待たないと、μPRISMセンサーから温度を取得している間に、イベントが終了してしまいます。

μPRISMとobnizを組み合わせる人は少ないと思いますが・・・参考まで。

次回はスプレッドシートに温度を自動で記述していきます。

2020年12月15日2020年12月16日

スマートホーム・ホットカーペット制御

IoTを駆使したモルモットのスマートホームを作ります。主要なハードはobnizボード、μPRISMセンサー、Merossスマートプラグ、そしてホットカーペット。使うクラウドサービスはIFTTTです。

モルモットの適温は18～24℃

モルモットを使い、快適なスマートホームを構築する実験を行います。

Google検索によると、モルモットの適温は18～24℃。（諸説あり）

冬場18℃を下回ったとき、ホットカーペットの電源を自動的にONにするシステムを作ります。

システム全体図

冒頭の全体図を再掲載します。

超小型センサーμPRISMで温度を取得し、BLEでobnizボードに値を飛ばします。
obnizで受け取った値を、ブラウザで表示します。
HTML（JavaScript）で温度を判定し、IFTTTのWebhookを作動させます。
IFTTTがWebhookをトリガーにして、スマートプラグMerossの電源を切り替えます。寒い時はON、暑い時はOFF。
モルモットが快適になります。

なお、図では省略していますが、obnizもクラウドサービスです。その存在を感じさせない・・・意識せず使えるのがすばらしいです。

1. μPRISMの取得温度をobnizへ

はじめにμPRISMを設置します。

我が家ではモルモットのケージの横にある３Dプリンター取り付けました。

ケージは洗うので、センサーを付けるのには向いていません。付近のものに取り付けましょう。

あと、モルモットにかじられないように注意してください。

μPRISMからセンサー値を取得するobnizボードも電源を入れておきます。

BLEで通信できる範囲であれば、どこに置いても良いです。

ちなみにμPRISMではなく、温度センサーをobnizボードに挿せば、BLEの必要はありません。

私は、μPRISMを使いたかったので、少し無駄がある構成になりました。

2. ブラウザでセンサー値を表示

昨日のHTMLコードをベースに使っています。

obnizで受け取ったセンサー値をブラウザに表示しました。

温度、あと湿度と日時を表示しています。

現在の温度は18.5℃のようです。モルモットの適温ギリギリ。

3. IFTTTのWebhook作動

IFTTTにWebhookのトリガーを登録います。

スマートプラグの電源をOFFにする”stop_meross”と、電源をONにする”run_meross”を作りました。

温度が18℃以下なら”run_meross”（電源ON）。温度が20℃以上なら”stop_meross”（電源OFF）。

ブラウザ側のJavaScriptでWebhookを分岐しています。

4. IFTTTでMeross操作

Webhookのトリガーが引かれたら、IFTTTのイベントが発動します。

うまく動作すると、スマートプラグMerossが「カチッ！」と音がなり、通電します。

Merossにホットカーペットの電源コードをつないでいれば、IoTホットカーペットとなります。

動作テスト

保冷剤でセンサーを冷やし、18℃以下でホットカーペットのスイッチが入ることを確認しました。

そして今度は、ドライヤーでセンサーを温め、20℃以上でホットカーペットのスイッチが切れることを確認しました。

パソコンなしで実行したい

このスマートホームシステムでは、ブラウザで温度判定のプログラムを動かしているため、パソコンやスマートホンでブラウザを起動していないと実行されません。

それでは実用的ではないので、次回、クラウドで温度管理できるように改修します。

2020年12月14日2020年12月14日

μPRISMのセンサー値をブラウザ表示

1円より縦横が小さいμPRISM（マイクロプリズム）。７つのセンサーを搭載した超小型IoTモジュールです。obnizと組み合わせて、ブラウザでセンサーの値を表示してみます。

ブラウザでセンサー値を確認

センサーの穴を回して、値の変化を見ます。

センサーの方向を変えてみると、地磁気が大きく変化し、窓の方向を向いたときは照度が高くなっています。

数値が多すぎると分かりにくいため、センサー値は四捨五入して表示してます。

※コードは最後に記述。

計測間隔はアプリで簡単に変更可能

μPRISMの専用アプリの設定を開くと、計測間隔を0.1秒から360秒の間で変更できます。

加速度、地磁気、照度、UVあたりは、計測間隔を短くして使うことがあると思います。

逆に温度、湿度、気圧は、計測間隔を長くして電池持ちを優先したほうが良いかもしれません。

マイコン・センサー構成

μPRISMのセンサー値を、BLEでobnizボードが受信します。

obnizボードもμPRISMも、電源につなぐ以外のことはしません。

受信内容サンプル

ブラウザに表示させたデータの1例です。

加速度	x:-1.05 y:-0.14 z:0.01
地磁気	x:48.9 y:-77.3 z:104.0
温度	21.2℃
湿度	34.0%
照度	3085.6lx
気圧	100756Pa
UV	0.0
日時	20/12/13 12:21:37

分かる範囲ですが、正常に取得できているようです。

μPRISMブラウザ表示コード

obnizパーツライブラリに参考コードがあります。

これを元に、ブラウザ表示用のHTMLを作りました。

obniz.jsは、3.5.0以上でなければエラーが出るのでご注意ください。

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <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>
  <p id="connect">接続中・・・</p>
  <table>
    <tr>
      <th>加速度</th>
      <td id="accel"></td>
    </tr>
    <tr>
      <th>地磁気</th>
      <td id="geo"></td>
    </tr>
    <tr>
      <th>温度</th>
      <td id="temp"></td>
    </tr>
    <tr>
      <th>湿度</th>
      <td id="humid"></td>
    </tr>
    <tr>
      <th>照度</th>
      <td id="light"></td>
    </tr>
    <tr>
      <th>気圧</th>
      <td id="pressure"></td>
    </tr>
    <tr>
      <th>UV</th>
      <td id="uvi"></td>
    </tr>
    <tr>
      <th>日時</th>
      <td id="date"></td>
    </tr>
  </table>
</main>
<script>
var obniz = new Obniz("obniz-ID"),
    $connect = $("#connect");

obniz.onconnect = async () => {
  await obniz.ble.initWait();
  const U_PRISM = Obniz.getPartsClass("uPRISM");
  obniz.ble.scan.onfind = async (peripheral) => {
    if (U_PRISM.isDevice(peripheral)) {
      $connect.text("マイクロプリズム発見！");
      const device = new U_PRISM(peripheral);
      device.ondisconnect = (reason) => {
        console.log(reason)
      }
      await device.connectWait();
      $connect.text("接続完了！");
      device.onNotify = (r) => {
        $("#accel").text("x:" + r.acceleration.x.toFixed(2) + " y:" + r.acceleration.y.toFixed(2) + " z:" + r.acceleration.z.toFixed(2));
        $("#geo").text("x:" + r.geomagnetic.x.toFixed(1) + " y:" + r.geomagnetic.y.toFixed(1) + " z:" + r.geomagnetic.z.toFixed(1));
        $("#temp").text(r.temperature.toFixed(1) + "℃");
        $("#humid").text(r.humidity.toFixed(1) + "%");
        $("#light").text(r.ambient_light.toFixed(1) + "lx");
        $("#pressure").text(r.pressure + "Pa");
        $("#uvi").text(r.uvi.toFixed(1));
        $("#date").text(`${r.time.year}/${r.time.month}/${r.time.day} ${r.time.hour}:${r.time.minute}:${r.time.second}`);
      };
      device.startNotifyWait();
    }
  };
  await obniz.ble.scan.startWait();
}

</script>
</body>
</html>

<html>

<head>

</head>

<body>

<main>

<h1>マイクロプリズム</h1>

<table>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</main>

var obniz = new Obniz("obniz-ID"),

$connect = $("#connect");

obniz.onconnect = async () => {

await obniz.ble.initWait();

const U_PRISM = Obniz.getPartsClass("uPRISM");

obniz.ble.scan.onfind = async (peripheral) => {

if (U_PRISM.isDevice(peripheral)) {

$connect.text("マイクロプリズム発見！");

const device = new U_PRISM(peripheral);

device.ondisconnect = (reason) => {

console.log(reason)

}

await device.connectWait();

$connect.text("接続完了！");

device.onNotify = (r) => {

$("#accel").text("x:" + r.acceleration.x.toFixed(2) + " y:" + r.acceleration.y.toFixed(2) + " z:" + r.acceleration.z.toFixed(2));

$("#geo").text("x:" + r.geomagnetic.x.toFixed(1) + " y:" + r.geomagnetic.y.toFixed(1) + " z:" + r.geomagnetic.z.toFixed(1));

$("#temp").text(r.temperature.toFixed(1) + "℃");

$("#humid").text(r.humidity.toFixed(1) + "%");

$("#light").text(r.ambient_light.toFixed(1) + "lx");

$("#pressure").text(r.pressure + "Pa");

$("#uvi").text(r.uvi.toFixed(1));

$("#date").text(`${r.time.year}/${r.time.month}/${r.time.day} ${r.time.hour}:${r.time.minute}:${r.time.second}`);

};

device.startNotifyWait();

}

};

await obniz.ble.scan.startWait();

}

</script>

</body>

</html>

obnizがまさかのμPRISM対応

obnizボードとμPRISMを両方持っている人は少ないと思います。

obnizのパーツライブラリにμPRISMが掲載されたときは、テンションが上がりました。

ウェアラブルの試作で、小ささと省電力が必要で、さらにWebの技術を中心に開発したいときには、この組み合わせが良い選択肢だと思います。

2020年12月13日2020年12月12日

μPRISM（マイクロプリズム）超小型センサー

μPRISMという超小型のIoTモジュールセンサーがあります。小型のプロトタイプ制作で良い選択肢になりそうです。

多機能・超小型センサー

加速度、地磁気、温度、湿度、照度、UV、気圧。７つのセンサーが搭載されており、Bluetooth通信ができ、ボタン電池で動きます。

３つのタイプがあり、玄人向けの基板タイプ。
電源につなぐだけで動く外部電源タイプ。
電池ケース一体型の電池タイプ。

私が持っているのは外部電源タイプです。

電池をつなげば簡単に動作する手軽さと、より小型なものに組み込める汎用性があります。さらに「IPX4」の生活防水。

サイズは、幅：8.0mm、高さ：11.4mm、奥行： 6.6mm。

ケーブルに断線防止カバーがあり、折り曲がらないため、高さは最大20mm程度見たほうが良いかもしれません。

専用のμPRISMアプリ

センサーの値は、専用のアプリをダウンロードすれば、簡単に取得できます。

数値の羅列で分かりにくい時は、グラフにして可視化できます。

専用アプリ以外でも使えそうなので、次回ブラウザで表示を試して見ます。

2020年12月12日

壊れたベッドの修理

2段ベッドが壊れて危険。けがをする前に修理します。ホームセンターの補強金具とネジで、十分修理可能です。

柵が落ちてきそう

2段ベッドの柵が、落ちてきそうです。

ネジがゆるいという問題ではなく、接合部の木ダボの半数が折れている状態でした。

男の子4人が、このベッドで遊んでいます。

柵に乗ったり、ぶら下がったり、負荷がかかりすぎたのでしょう。

補強金具で修理

I字×４、L字×４の補強金具、木ネジをホームセンターで購入。

合計で1,000円くらいです。

I字金具で横から補強します。

ボロボロのベッドなので、見た目は気にしません。

柵の両端の裏は、L字で補強。

L字金具は裏表を確認して購入が必要です。

皿ネジが収まるくぼみがどちら側にあるかで、裏表を判断します。

私は間違えたので、ネジが少し浮きました・・・。

子供が落ちない

補強金具で柵が修理され、頑丈になりました。

これで、柵も子供も、落ちてくることはないでしょう。

電動ドライバーがあれば、そこまで大変な作業ではないため、ベッドが壊れてきたら、早めに補強がお勧めです。