Soracom

新しい Dashboard を作成し、ソラコムが用意したサンプルデータソース (Demo) を使用した Panel を 1 つ追加します。

ここで作成する Dashboard の特徴は以下のとおりです。

• 可視化するリソースやプロパティを選択できます。
• 系列 (軸) に単位が設定されていて、系列の名前 (凡例) が設定されています。

ステップ 1: 新しい Dashboard と Panel を作成する

1. Lagoon コンソールにログイン して、[ (Dashboards)] → [New] → [New Dashboard] の順にクリックします。

   

   New dashboard という名前の Dashboard が作成されます。

2. [Add a new panel] をクリックします。

   

   Panel が作成され、「Edit Panel」画面が表示されます。

   

ステップ 2: Panel を設定して temperature と humidity を表示する

任意のデータを Panel に表示する設定にして、サンプルデータソース (Demo) の temperature と humidity を表示します。

1. データセクションの [Query] タブをクリックし、[Data source] で「Harvest (default)」を選択します。

   

2. Query「A」を以下のように設定します。

   項目	説明
   [Resource Type]	「$resource_types」を選択します。
   [Group]	「$groups」を選択します。
   [Resource]	「$resources」を選択します。
   [Data Format]	「Standard」を選択します。
   [Properties]	「$properties」を選択します。

   

   「$」から始まる項目は Variables (変数) です

   「$resource_types」のように、「$」から始まる項目は Variable (変数) です。Variable を使うと、Dashboard を表示できるユーザーであれば Panel の表示内容を変更できます。Variable について詳しくは、Variables (変数) を利用して Panel に表示する対象データを切り替える を参照してください。

   Panel の表示内容を固定するには、Variable 以外の項目を選択します。たとえば [Resource Type] では「Air」や「Demo」を選択してください。Query の設定について詳しくは、Panel に表示するデータを選択する (Query) を参照してください。

3. 画面上部で Dashboard の設定を変更して、[ (Refresh dashboard)] を押します。

   項目	値
   [resource_type]	「Demo」を選択します。
   [groups]	「All Groups」を選択します。
   [resources]	「Device-1」を選択します。
   [properties]	「temperature」(温度) と「humidity」(湿度) を選択します。

   

   humidity と temperature のグラフが追加されます。

   

ステップ 3: Panel のタイトルを設定する

標準では「Panel Title」と表示されています。

1. [All] → [Panel options] の順にクリックし、[Title] に「湿度と温度」を入力します。

   

ステップ 4: 系列の名前を設定する

[Transform] を使用して、各系列の名前を以下のように設定します。[Transform] は、Query の結果を変換する機能です。詳しくは、Panel で可視化する前に Query を変換する (Transform) を参照してください。

1. データセクションの [Transform] タブをクリックします。

   

2. [Add transformation] に「Rename by regex」を入力して、[Rename by regex] をクリックします。

   

3. [Match] と [Replace] を以下のように設定します。

   項目	説明
   [Match]	「(.*) humidity」を入力します。
   [Replace]	「$1 湿度」を入力します。

   

   グラフに表示される凡例が「Device-1 humidity」から「Device-1 湿度」に変わります。

4. [＋Add transformation] をクリックします。

   

5. 手順 2～3 と同様の操作で、グラフに表示される凡例を「Device-1 temperature」から「Device-1 温度」に変更します。

   

   グラフの凡例が日本語に変更されました。

ステップ 5: 系列の単位を設定する

Panel の可視化に関する共通オプションの [Overrides] を使用して、各系列の単位を設定します。

1. [Overrides] → [＋Add field override] の順にクリックします。

   

2. [Fields with name] をクリックして、[Fields with name] で「humidity (base field name)」を選択します。

3. [＋Add override property] をクリックし、「Standard options > Unit」を入力して、「Standard options > Unit」を選択します。

   

4. [Standard options > Unit] に「Misc / Percent (0-100)」を入力して、「Misc / Percent (0-100)」を選択します。

   湿度のグラフの単位が % に変わります。

   

   上記の表の Override 1 の設定が終わりました。

5. 上記の表の Override 2 も同様の手順で設定します。

   項目	説明
   [Fields with name]	「temperature (base field name)」を選択します。
   [＋Add override property]	「Standard options > Unit」を選択します。
   [Standard options > Unit]	「Temperature / Celsius (°C)」を選択します。

   温度のグラフの単位が °C に変わります。

   

   なお、2 つの系列で単位が異なるため、自動的に 2 軸グラフに変更されています。

ステップ 6: Dashboard を保存する

1. 「Edit Panel」画面で [Apply] をクリックします。

   

   Dashboard 画面に戻ります。

2. [ (Save dashboard)] をクリックします。

   

   Save dashboard 画面が表示されます。

3. [Dashboard name] に Dashboard の名前 (例: Demo 用 dashboard) を入力して、[Save] をクリックします。

   

   Dashboard が保存されます。そのほかの項目について詳しくは、新規保存する を参照してください。

ステップ 7: Dashboard で Variables の値を変更する

ステップ 2 で、データセクションの [Query] タブの Query「A」で Variables (変数) を選択しました。Variables を選択した場合は、Dashboard の画面で Panel の表示内容を変更できます。

1. Dashboard 画面上部の [resources] で、たとえば「Device-1」と「Device-3」にチェックを入れて、何もない部分をクリックします。

   

   Panel に表示されるグラフが更新されます。

   

ステップ 8: Dashboard を再表示する

作成した Dashboard を再表示して、Dashboard を保存したときの表示に戻ることを確認します。

1. [ (Dashboards)] → [Browse] → [General] の順にクリックし、作成した Dashboard をクリックします。

   

   作成した Dashboard が表示されます。