Webコントロールをバージョンアップ

試作版のまま使用してきたコントロール用Webページですが、機能や表示すべき項目が決まってきましたので、この辺りできちんと（？）作りこんでみました。

webコントロール画面

2カラムの構成で、メインにカメラ画像と操作ボタン、サイドには情報表示と設定ボタンを配置しました。　情報表示にはアナログメーターのようなデザインを採用しています。　これは JustGage というJavaScript用ライブラリを使用しています。　複数のメーターを表示していますが、動作も軽快でカスタマイズの為のオプションも充実しています。

表示しているデータは、wifi電波強度、超音波距離測定値、CPU負荷、CPU温度、バッテリー電圧、バッテリー電流です。　また、稼働時間は数値で示しています。　情報の取得はjQueryプラグインのPeriodicalUpdaterを使い、2秒毎にリクエストを送信しjson形式で受けています。

カメラ画像の中心にある、照準のようなものは超音波距離計の測定エリアの目安となっており、測定値も表示しています。　この表示は、情報表示ボタンで非表示に出来ます。

今後は、コントロールボタンのキーボード割り当てや特殊コマンドを実行可能なインターフェースを盛り込んでいきたいと思います。

自分なりには納得の見栄えではあるのですが、webデザインの素質はありませんね。　やっぱり。

Webコントロールの画面構成 webコントロール画面は、MJPG-Streamerのストリーミング映像を中心に構成しています。機能面では、Motionの方が充実して […]
View Direction Rotation Control System ハウスローバーを無線LAN経由でコントロールする場合、webカメラの映像や命令には遅延が生じます。直進の場合は距離センサーのデータを参考に […]
Webカメラに超音波センサーを組み込む webカメラへパン・チルト機構を設けますが、超音波センサーや照明用LEDも同じ方向を向くような構成にしたいと思います。購入前には計画し […]
サウンド機能の追加とインターネットラジオの受信アラートを発報するために赤色LEDを4ヶ所に配置し、回転発光、フラシュ発光ができるようになりました。　これにあわせ、サイレン音を発生させる […]
新型シャーシ用インターフェースボード新型シャーシには、2つの白色LEDと4つの赤色LEDを新設しました。　その信号線を引き出すために、インターフェースボードを再構成しました。 […]
2016年の製作計画謹賀新年。昨年の年頭にも開発計画を立て、8割位は実行できたと思います。　年末には駆け込みで新型シャーシの製作も行いました。　総括とし […]