Kuroyagi飼育日誌

学んだことの備忘録

RubyとJavascriptでグラフを描く【その1】

会社でシリアル通信で受けたデータをリアルタイムで表示するプログラムをよく作ります。普段はVisual CやMatlabで作るのですが、先輩がRubyJavascriptで作っているのを見て便利そうだったのでお勉強します。

 

先ずはrubyでのデータ処理やらリアルタイムと欲張らずにjavascriptcsvファイルからデータを読み込んでグラフにするといった簡単な処理をやってみます。

 

そこで参考にしたのが以下の【記事1】です。

 

【記事1】

qiita.com

 

これは単純明快で直ぐに動きます!とても分かりやすく、複雑なことも書いてないので初心者には大変ありがたい解説です。

 

2分くらいで準備完了です!描けました!

 

f:id:cocosuzu:20170311140840p:plain

 

ただし、詳しい知識は皆無です…ajaxjavascriptのデータ処理などここから学んでいきたいと思います。

 

基本的にjsの描画処理、Rubyでデータの送受信、測定系の模擬簡易モデルについて抑えればいいと思いますので、以降は以下を課題としたいと思います。

 

javascript

・列数、行数を自在に操作

・プロット形式を棒グラフから他のにする

 

Ruby

csvファイルを一定間隔で保存していくRubyの処理

・外部装置からのシリアルデータ読み込み

 

【周辺】

・シリアルデータを送信する機器を作る(ArduinoRaspberry Piがお手軽だと思う)

 

また、そろそろGitをちゃんと使えるようにした方がよさそうなため、追加課題としてGitの実践練習も行います。