Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

HTML5 によるロボット制御

7,123 views

Published on

HTML5 Conference 講演

Published in: Technology
  • Be the first to comment

HTML5 によるロボット制御

  1. 1. HTML5 Conference 2015 HTML5 によるロボット制御
  2. 2. 自己紹介  Twitter: @masap  職業: 組み込みプログラマ(主に Wi-Fi)
  3. 3. 3/28 HTML5 でロボット制御とは
  4. 4. ネイティブから HTML5 へ  ロボット制御はネイティブが主流  C/C++ を書く必要がある  HTML5 での開発へ  Web 開発者もロボット制御が可能になる  ロボットに限らずハードウェア制御も可能なので IoT 等への応 用もできる  このスライドでは以下の二通りを紹介  WebSocket 経由で制御  Web API を新設する
  5. 5. 5/28 WebSocket 経由でルンバを動かす
  6. 6. 6/28 ハードウェア構成図 PC ルンバスマホ WebSocket USB Serial
  7. 7. 7/28 ソフトウェア構成図 PC ルンバスマホ WebSocket USB Serial ROS Rosbridge (WebSocket Server) roslib.js Webアプリ
  8. 8. ROSとは  ロボット制御のためのライブラリ、ツール  Robot Operating Systemの略だがOSではない  ロボットを制御するための統一的なAPIを提供する  制御プログラムは、ユーザーが C++ で記述する
  9. 9. ROS の仕組み  ROS の基本用語  ノード、publish、subscribe ROSアプリ cmd_vel ノード (移動指示を受ける) publish (前進、回転等の指示を送る) odom ノード (位置情報を発信する) subscribe (情報を取得する)
  10. 10. Rosbridge とは  ROS を JavaScript から使用できるようにするパッ ケージ  WebSocket サーバー機能を持つ  ユーザーは JavaScript で WebSocket サーバに接続 し、ロボットにコマンドを送る  ROS を使うには C++ を書く必要があったが JavaScript で書けるので Web 開発者にやさしい
  11. 11. Rosbridge の使い方  ライブラリのインストール  eventemitter2.jsとroslib.jsをダウンロードする  WebScoket サーバへ接続 var ros = new ROSLIB.Ros(); ros.connect('ws://localhost:9090');
  12. 12. ルンバに指示を送る (1/2)  ルンバに移動コマンドを送る  cmd_vel というノードに前進コマンドを送る var cmdVel = new ROSLIB.Topic({ ros : ros, name : '/cmd_vel', messageType : 'geometry_msgs/Twist' }); var forward = new ROSLIB.Message({ linear : { x : 0.1, y : 0.0, z : 0.0 }, angular : { x : 0.0, y : 0.0, z : 0.0 } }); cmdVel.publish(forward); ROS アプリ cmd_vel ノード (移動指示を受ける) publish (前進、回転等の 指示を送る)
  13. 13. ルンバに指示を送る (2/2)  指示の詳細  進行方向と回転方向を指定  linear: 進行方向と速度 (meter/sec)  angular: 回転方向と速度 (radian/sec)  平面で考えると簡単  linear の x 座標が + なら前進、 - なら後退  angular の z 座標が + なら反時計回り、 - なら時計回り
  14. 14. ルンバの情報を受け取る  ルンバの情報を受け取る  odom というノードを subscribe する var listener = new ROSLIB.Topic({ ros : ros, name : '/odom', messageType : 'nav_msgs/Odometry' }); listener.subscribe(function(message) { console.log('Received message: ' + message.header.seq); listener.unsubscribe(); }); ROS アプリ odom ノード (位置情報を発信する) subscribe (情報を取得する)
  15. 15. 15/28 WebAPI でルンバを動かす
  16. 16. Web API とは  二種類のWeb API  Web 上のサービスとして提供  Twitter API、Youtube API、...  ブラウザ上のJavaScript API (今日扱うのはこちら)  navigator.getUserMedia, navigator.geolocation, ...
  17. 17. ロボットを制御するWeb API  ロボットを制御するWeb APIはあるのか  今の所は無い。なので新しく作る  何を作るのか  navigator.getusermedia のように navigator.robotxxx のような API を作る  どうやって新しい Web API を作るのか  Firefox を修正する  Foxberry Pi を使用する
  18. 18. 作る意義  そうまでして自分向けに作る意味はあるのか  W3C Browsers and Robotics Community Groupにて 標準化検討中 http://www.w3.org/community/browserobo/  未来の標準を作る
  19. 19. Firefox を修正する  なぜ Firefox か  Chrome、Safari、IE と比較してハードウェアにアクセスする Web API が最も充実しているため  Firefox では Gecko が Web API を実装している  なので Gecko にコードを追加することで新しい Web API を作 ることができる  gecko/dom/geolocation 等 Gecko Web アプリ Web API
  20. 20. Foxberry Pi を使用する  Gecko の修正は敷居が高い  JavaScript と C++ の両方を書かなければならない  Foxberry Pi で Web API を実装  JavaScript を使って擬似的に Web API を実装できる Firefox OS JavaScript WebIOPi ハードウェア HTTP Raspberry Pi Web API
  21. 21. WebIOPi  WebIOPi とは  Raspberry Pi 上で動く IoT フレームワーク  HTTP で WebIOPi に接続してコマンドを送ることでハー ドウェア制御ができる
  22. 22. 必要な Web API は  ロボットを動かす API  ロボットを動かす = モーターを動かす  ロボットの情報を受け取る API  ロボットの関節の状態  ロボットに搭載したセンサーの情報  カメラの情報 (これは既存の WebRTC で取得)  必要なのは GPIO と I2C
  23. 23. GPIO とは  GPIOとは  General Purpose Input/Output(汎用入出力)の略。  コンピュータと周辺機器を接続するためのピン。  ピン番号を指定して、 on/off を設定したり、 on/off を 読み取ったりできる。  ロボット制御においてはモーターの on/off を制御でき る。
  24. 24. I2C とは  I2Cバスとは  シリアル通信のためのバス  GPIO ではモーターの on/off しか制御できないのに対 し、モーターの回転数等を細かく制御できる
  25. 25. Web GPIO API  Web GPIO API  navigator.mozGpio.write(ピン番号, 値)  例えば 10 番ピンにモーターがつながっている場合、以下のよ うに on/off できる navigator.mozGpio.write(10, 1) で on navigator.mozGpio.write(10, 0) で off  navigator.mozGpio.read(ピン番号, 値)
  26. 26. Web I2C API  Web I2C API  navigator.mozI2c.getI2cDevice(デバイス名,アドレス)  I2c デバイスの取得  i2c_device.write/read(レジスタアドレス, 値);  レジスタへの書き込み、レジスタの読み取り  例  DRV8830 を用いたモーター制御 var i2c_device = navigator.mozI2c.getI2cDevice("/dev/i2c-1", 0x64); i2c_device.write(0x00, 0xfd);
  27. 27. まとめ  HTML5 でもロボットを  このように HTML5 でもロボットを動かせるようになって きています  他にも Tessel や Espruino 等、 JavaScript で動かせる ハードウェアがあります  楽しいのでぜひ!
  28. 28. 28/28 以上

×