BeeX Tech blog

BeeXではクラウドネイティブアプリ開発、企業の基幹クラウド基盤構築、システム移行、運用保守を行っています。

【詳細手順書公開】SAP Cloud Platform上のセンサーデータをUI5で可視化する


参考ブログ

Visualizing iPhone Sensor Data with SAPUI5
Special Thanks to Author  Anthony McLeod !

デモイメージ

今回は、汀のダッシュボードを作成します。


 

前提条件

【詳細手順書】iPhone内蔵センサー情報をSAP Cloud PlatformのIoTサービスを使ってストリーミングするの設定が完了していること
上記ブログのリンクからDashboardInCloud.zipをダウンロードしておきます。

IoT Destinationを作成

SAP Cloud PlatfromCockpitのConnectivity Destinationsを選択します

下記情報を入力してSAVEを選択します。

項目 設定値
Name iotmms
Type hppts
URL https://iotmms<<S-user>trial.hanatrial.ondemand.com/
Proxy Type Internet
Authentication BasicAuthentication
User Sユーザ
Password パスワード
Additional Properties


WebIDEEnabled True
WebIDESystem API
WebIDEUsage odata_gen

登録完了

Check Connectionを選択して接続テストを実施します。

接続テスト成功

SAP Web IDE

SAP Cloud Platform CockpitのServicesタブ SAP Web IDEを選択します。

Go to Serviceを選択します。

SAP Web IDE

File->Import->From File system

ダウンロードしたDashboardInCloud.zipを選択します。

index.htmlを実行します。

Enter Table NameにT_IOT<<メッセージタイプID>>のテーブルを入力してStartを選択します。

テーブルデータが参照できていることがわかります。

View Chartボタンを推して、グラフ描画のインターバルを選択すると、リアルタイムでグラフ化されます。