達成率が50%未満の時は「まだまだ・・・」、80%を超えた時は「もう少し!」、100%になると「おめでとう!!」といった具合に、達成率に応じて違う画像を表示させたい場合はどうすればいいのでしょうか。
今回の記事では、データの値によって異なる画像を表示する方法をご紹介します。

▲完成図

シングルイメージを使おう

データの値によって異なる画像をボード上に表示させるには、シングルイメージというチャートを利用します。
シングルイメージでは、指定した条件に一致する場合に任意の画像を表示させることができます。

シングルイメージの設定は以下の3つです。

1.画像設定

2.値による画像設定

3.アラートによる画像設定

▲シングルイメージ設定画面

例えば、[アスペクト比を保持する]にチェックを入れると、画像のアスペクト比(画像の幅と高さの数値比率)が崩れないように表示されます。
また、集計項目の値やアラートレベルの値によって表示する画像を設定することができます。

詳細はこちらのマニュアルをご参照ください。

実際に設定してみよう

今回は、達成率という項目の値に応じて画像が変更されるように設定を行います。

ボードにシングルイメージを追加する

ボードにチャートを追加し、[シングルイメージ]を選択します。

▲シングルイメージを選択

シングルイメージの設定

シングルイメージチャートを追加しても、設定を行わなければボードには何も表示されません。
チャートを追加した場所をクリックして「チャート編集」を開きます。

必要に応じて「画像を拡大/縮小する」「アスペクト比を保持する」にチェックを入れてください。
次に、[追加]をクリックします。

▲拡大/縮小やアスペクト比の設定、画像の追加

[アップロード]をクリックして、必要な画像をアップロードしてください。
アップロードが完了したら[OK]をクリックします。

▲使用する画像のアップロード

アップロードした画像それぞれに「最小値」「最大値」を設定すれば完了です。
今回は以下のように設定しました。

• 100%以上　・・・　100%.png 「目標達成!おめでとう!」
• 80%以上　・・・　80%.png 「もう少し!頑張って!」
• 50%以上　・・・　50%.png 「50% 突破!」
• 0%～49%　・・・　50%以下.png 「まだまだ・・・頑張ろう!」

画像のように最大値を未入力とすることで、100%以上といった設定が可能です。

最後に

今回は、データの値によって異なる画像を表示する方法をご紹介しました。
色々な使い道があると思うので、ぜひ試してみてください。

▲完成図