2. チュートリアル2A: スマートフォンから送信されたデータをリアルタイム可視化してみよう

このチュートリアルでは、スマートフォンのセンサーデータと映像データをintdashサーバーにストリーミングし、PC上でそのデータをリアルタイムに可視化します。このチュートリアルを実施することで、以下を知ることができます。

  • intdash Motionからセンサーデータ及び映像データを送信する方法

  • Data Visualizerで、スマートフォンからのデータを表示する方法

../_images/motion-live-tutorial.png

2.1. intdash Motionの設定を行う

最初に、intdash Motion上で、送信するデータを選択します。 intdash Motionの計測開始画面にて、[Settings]をタップします。

../_images/settings.png

図 6 設定画面を開く

設定画面では、データの種類ごとに、送信の設定を行うことができます。

注意

[Save to Server]をオンにすると、送信された計測データはサーバーに保存されます。

2.1.1. 映像データの設定

  1. [Video]をオンにします。

    ../_images/video-for-streaming.jpg

    図 7 動画設定画面

  2. 以下のように設定します。

    • Stream to Server: オン

    • Save to Server: オン

    • Channel: 1

    • Codec and Options: JPEG

2.1.2. センサーデータの設定

  1. [Sensors]をオンにします。

    ../_images/sending-sensor-data.jpg

    図 8 GPS設定画面

  2. 以下のように設定します。

    • Stream to Server: オン

    • Save to Server: オン

    • Channel: 1

    • Sensor Types: すべてオン

2.1.3. GPSデータの設定

  1. [GPS]をオンにします。

    ../_images/gps-data.jpg

    図 9 GPS設定画面

  2. 以下のように設定します。

    • Stream to Server: オン

    • Save to Server: オン

    • Channel: 1

  3. Main画面で play をタップします。

    計測が開始されると、経過時間の表示が増えていきます。

  4. ■をタップして計測を終了します。

これで、スマートフォンの設定は完了です。

2.2. Data Visualizerの設定を行う

計測を可視化するには、Data Visualizerを使用します。

ここでは、あらかじめ準備された設定ファイルをインポートして、ダッシュボードを作成します。

2.2.1. Data Visualizerを開く

注釈

アクセス先のURLのスキーム(http またはhttps)やホスト名、ログインに使用するパスワードは、環境構築時の設定により異なります。 これらの情報が不明な場合は、環境構築の担当者に確認してください。

  1. Microsoft Edge ブラウザーを使用して、 https://<intdashサーバーのホスト名>/ にアクセスします。 ログイン画面が表示されますので、ユーザー名とパスワードを入力してログインしてください。

    ログインするとProject Consoleアプリケーションが表示されます。

  2. 画面左の「所属プロジェクト一覧」から所属しているプロジェクトの一覧を表示し、使用するプロジェクトを選択します。 ここでは「Global Project」を使用するため、「Global Project」の[詳細]をクリックします。 なお、任意のプロジェクトを使用する場合は、使用するユーザーアカウントと、エッジアカウントをプロジェクトに所属させる必要があります。

  3. 画面左の「アプリケーション」から利用可能なアプリケーションの一覧を表示し、一覧から、「Visual M2M Data Visualizer」を選択します。

    Data Visualizerのダッシュボードが表示されます。

2.2.2. データ設定(.dat)ファイルをインポートする

データ設定ファイルを、Data Visualizerに用意されている専用のダウンロードページから入手します。

  1. Data Visualizer画面左側の links (Links)をクリックします。

  2. 「Download DAT File」をクリックします。

    ../_images/dat-files.png

    図 10 DATファイルの一覧

  3. 以下のDATファイルをダウンロードします。

    • General Sensor > general_sensor_ch001.dat

    • Video > video_ch001.dat

  4. Data Visualizer画面左側の[Data Settings]( data-settings ) > [Add Group] でグループを作成します。

  5. 作成されたグループで [Import]をクリックして、上でダウロードした2つのDATファイルをインポートします

2.2.3. ダッシュボード定義ファイル(.scrn)をインポートする

  1. ダッシュボード定義ファイル 2_1_smartphone.scrn をダウンロードします。

  2. Data Visualizer 画面下部のScreen list( screen-list )ボタン > [Import]をクリックして、ダッシュボード定義ファイル(.scrn)をインポートします。インポートしたダッシュボードは、リストの一番右側に追加されます。

  3. インポートされたダッシュボード「SmartPhone Screen」をクリックして開きます。

    ../_images/dashboard.png
  4. ダッシュボード上の各パネルに edge1 のデータを表示するように設定します。

    このダッシュボードは、Edge Switcherで指定されたエッジからのデータを表示する設定になっているため、画面下部のEdge Switcher (edge-switcher-icon) をクリックし、 edge1 を選択します。

    ../_images/edge-switcher-select-edge1.png

    図 11 Edge Switcherでedge1を選択

    注釈

    Edge Switcher (edge-switcher-icon) ボタンが表示されていない場合、画面左側の misc-icon MiscメニューでEdge Switcher機能をオンにしてください。

2.3. intdash MotionのデータをData Visualizerで可視化する

intdash MotionとData Visualizerの設定が完了したら、実際にスマートフォンからデータをintdashに送信し、データを可視化します。

1. データをリアルタイムで可視化するため、Data VisualizerをLIVEモードにします。ピンク色のLIVEモードアイコン( live-mode )が表示されている場合は、現在LIVEモードになっています。 グレーのアイコン( live-mode-inactive )が表示されている場合は、アイコンをクリックしてLIVEモードに切り替えてください。

../_images/live-button.png

図 12 LIVEモードの表示

  1. スマートフォンで、intdash Motionの下部のメニューにある[Main]をタップします。

  2. intdash Motionの画面中央の play をタップし、計測を開始します。

  3. Data Visualizerで再生ボタン play をクリックします。スマートフォンから送信されているデータがダッシュボードに表示されます。

    ../_images/dashboard-with-data.png

    これで、スマートフォンのデータがintdashに流れている様子を、自分のPC上で確認することができました。

    スマートフォンを振ったり動かしたりすると、Data Visualizerに表示されている数値が変化することが確認できます。

  4. intdash Motionで■をタップし、計測を終了します。

    intdash Motionで play をタップしてから■をタップするまでの計測データが、1つの計測としてサーバーに保存されます。