メトリックカード

メトリックカードウィジェットは、Workshop 変数の値を、設定可能なカード形式のインターフェースで表示します。通常、メトリックカードは Workshop モジュール内の主要な数値をハイライトするために使用されます。メトリックカードウィジェットを設定するモジュール作成者は、以下の操作を行えます。

• メトリクスのグループをまとめて表示します。
• 条件付き書式設定を使用してメトリクスに注意を引き、ユーザーがメトリクスの値を解釈しやすくします。
• メトリクスのレイアウトを設定し、カード、タグ、またはリストとして表示します。
• 時系列の履歴を示すスパークラインを含む時系列データを表示します。

以下のスクリーンショットは、Workshop モジュールでメトリックカードウィジェットを使用して、各国の COVID-19 ワクチン接種の展開に関する統計を表示する例を示しています。以降の例でも、このコンテキストを使用します。

設定オプション

以下の画像は、未設定のメトリックカードウィジェットの初期状態と、COVID-19 ワクチン接種の展開に関するメトリクスを表示するように設定されたウィジェットの状態を示しています。

まず、矢印の右側にある最初の画面に示す、メトリクスのグループで構成されるウィジェットの設定オプションについて説明します。次に、矢印の右側にある 2 番目の画面に示す、個々のメトリクスで利用可能な設定オプションについて説明します。

ウィジェットの設定

メトリックカードウィジェットの主要な設定オプションは以下のとおりです。

• ラベル

  • メトリックカードウィジェットのラベルを任意で設定します。このテキストはウィジェットの上部に表示されます。

• メトリクス

  • メトリクスを追加ボタンは、メトリックカードウィジェットに新しいメトリクスを追加します。
  • メトリクスを複製を選択すると、既存のメトリクスの設定をコピーできます。
  • リスト内のメトリクスにある上下方向の矢印で、ウィジェット内に個々のメトリクスが表示される順序を変更します。

• レイアウトスタイルを選択

  • カード

    • 上記の例および以下のスクリーンショットのように、ウィジェット内のメトリクスをカードとして表示します。時系列の可視化は、このレイアウトスタイルでのみサポートされています。
      
      
      
      

    • カードのレイアウトスタイルでは、以下も選択できます。

      • カードを配置する方向：横方向または縦方向。
      • 各カード内のデータ配置に使用するテンプレート：上下配置または左右配置。
  • タグ

    • 以下のスクリーンショットのように、ウィジェット内のメトリクスをタグとして表示します。
      
      
      
      

    • タグのレイアウトスタイルでは、カードを配置する方向を横方向または縦方向から選択できます。

  • リスト

    • 以下のスクリーンショットのように、ウィジェット内のメトリクスをリストとして表示します。
      
      
      
      

    • リストのレイアウトスタイルでは、各カード内のデータ配置に使用するテンプレートを上下配置または左右配置から選択できます。

• メトリクスのサイズを選択

  • ウィジェット内のすべてのメトリクスの表示サイズを設定します。選択肢はコンパクト、標準、大です。

• 条件付き表示設定

  • 変数の値やその他の条件に基づいて、メトリックカードウィジェットを表示または非表示にできます。これにより、現在のアプリケーションの状態に応じて、ユーザーに表示するメトリクスを動的に制御できます。
  • true または false に評価される条件を指定して、条件付き表示設定を行います。条件が false に評価されると、メトリックカードウィジェット全体が非表示になります。

メトリクスの設定

個々のメトリクスは、以下のオプションを使用して設定できます。

• ラベル
  • メトリクスのラベルを任意で設定します。このテキストは個々のメトリクスの上部に表示されます。
• 説明
  • 固定または変数に基づく説明テキストを任意で設定します。以下に示すように、ユーザーが情報アイコンにカーソルを合わせると、説明が表示されます。

• 値の種類

  • 表示する値が文字列か数値かを指定します。
  • このセクションでは、以下のオプションも設定します。
    • **値：**メトリクスに設定する値には、対応するデータ型の Workshop 変数を使用する必要があります。そのため、値の種類を文字列に設定した場合は、メトリクスに設定する文字列変数を選択する必要があります。同様に、値の種類を数値に設定した場合は、数値変数を選択する必要があります。Workshop 変数の詳細については、変数を参照してください。
    • 数値の書式設定：この任意の設定は、値の種類が数値の場合にのみ利用可能です。変数の数値を表示するための値の書式設定方法を指定でき、表示する小数点以下の桁数も指定できます。メトリクスに表示する小数点以下の桁数を制限するには、小数点以下の桁数項目で最大値を設定します。小数点以下の桁数がこの値を超える数値は、指定した桁数に丸められます。たとえば、小数点以下の最大桁数を 2 に設定すると、3.14159 は 3.14 と表示されます。値の書式設定の詳細については、Workshop の書式設定を参照してください。
    • **条件付き書式設定：**この任意の設定では、表示されるメトリクスの値にルールに基づく書式設定を適用できます。以下の例では、値がゼロ以下の場合はメトリクスを赤色で表示し、それ以外の場合は緑色で表示しています。詳細については、Workshop の書式設定を参照してください。
      
      
      
      

• 補助メトリクスを表示しますか？ 同じメトリクス表示内で、主要なメトリクスの下に 2 番目のメトリクスを表示するための任意の設定です。この切り替えを Yes に設定すると、主要なメトリクスと同様の、補助メトリクスの値の種類を設定する画面が開きます。

• 可視化を表示しますか？ メトリクスとともに、時系列の履歴を示すスパークラインを表示するための任意の設定です。この切り替えを Yes に設定すると、以下のオプションを含む設定画面が開きます。

  • **位置：**スパークラインをメトリクスの値に対して Side-by-side（隣）に表示するか、Stacked（下）に表示するかを指定します。

  • **時系列セット：**可視化する時系列です。以下のスクリーンショットに示すように、Time series set 変数を使用して指定します。時系列セット変数を含む Workshop 変数の詳細については、変数を参照してください。
    
    
    
    

  • **期間：**データを表示する期間を指定します。プリセットの選択肢には All time、Last hour、Last day、Last week がありますが、Custom range を選択すると詳細な期間セレクターが開き、Exact または Relative の期間を指定できます。期間の指定の詳細については、Workshop の時系列プロパティを参照してください。

  • **ベースライン：**このパラメーターをオンにすると、スパークラインとともにベースラインが表示され、傾向を視覚的に解釈しやすくなります。ベースラインの指定の詳細については、Workshop の時系列プロパティを参照してください。

• インタラクティブメトリクス：カードの選択時に、コマンド、アクション、またはイベントをトリガーするための任意の設定です。デフォルトはインタラクションなしです。