Androidのメモとか

ポキオの日記です。今日も遅延してない。

micro:bitの加速度センサーの値をWeb Bluetooth APIで読み取ってみる

スポンサードリンク

Web Bluetooth APImicro:bitを面白くする。

micro:bit web bluetooth api

よっ、Web Bluetooth API

前回は、JavaScriptブロックエディタのような、チョッパヤプログラミングでも、Bluetoothがいろいろ使えそうであるということがわかりました。

relativelayout.hatenablog.com

となれば、実際にBluetoothで通信してみようと思います。今回はブラウザ上でWeb Bluetooth APIを動かして、micro:bitにアクセスして、加速度センサーの値を監視してみようと思います。

まずはmicro:bit側のプログラミング

とはいえ、プログラミングというレベルではないですが・・・。

micro:bit web bluetooth api

こんな感じで、ありとあらゆるサービスをmicro:bit起動時にスタートするだけ。今回は加速度センサーしか使わないので、それだけでもいいかもしれません。

bluetooth.startAccelerometerService()
bluetooth.startButtonService()
bluetooth.startIOPinService()
bluetooth.startLEDService()
bluetooth.startTemperatureService()
bluetooth.startMagnetometerService()

30秒くらいでコーディングが終了します。

HTML側のプログラミング

まず、事前情報として、以下のサイトを参考にしました。

Web Bluetooth

Bluetooth Developer Studio - Profile Report

Web Bluetooth APIの仕様書と、micro:bitのBLE関係の資料です。前者はW3Cの公式っぽいんですが、後者は非公式情報っぽいのでお気をつけて。公式のBLEの仕様書って何処かにあるんですかね・・・。

github.com

HTML側のコードはちょっと長いので、githubにアップしておきました。そして、毎度毎度のことですが、HTMLコーディング能力が低すぎるので、あまり参考にならないかもしれません…。

簡単にサマると、こんなことをしています。

  • 近くにあるBluetoothバイスを表示させて、micro:bitを選ばせる
  • 接続して、加速度データの通知間隔を設定する
  • 加速度データの通知設定をする
  • 加速度データを受信したら、そのデータを表示する
  • 加速度データに応じて、ページの背景色を変える

さっそく動かしてみます。

こんな感じです。micro:bitを動かすと、Webページの背景色が変わっていることがわかると思います。

#microbit の加速度センサーのデータを #webbluetooth で取得する。

A post shared by pokio (@pokiiiiio) on

ちなみに、githubgithub pages機能により、みなさんも以下のページにアクセスすることで、micro:bitの加速度センサーの値を読み取ることができます。もしよかったら、遊んでみてください。(Web Bluetooth API対応のOS・ブラウザに限り動作しますが、たまに動かないこともあるのでご了承ください…)

pokiiio.github.io

いやぁ、micro:bitって本当にいいもんですねー。

「Androidのメモとか」は、Amazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

このブログは個人的なメモ書きであったり、考えを書く場所であります。執筆者の所属する団体や企業のコメントや意向とは無関係であります。また、このブログは必ずしも正しいことが書かれているとは限らず、誤字脱字や意図せず誤った情報を載せる場合がありえます。それが原因で読者が不利益を被ったとしても、執筆者はいかなる責任も負いません。ありがとうございます。