【Microsoft Lists】リニアゲージの表示📊

2023/11/27 更新: 現在の値がどのグループに属しているか分かりにくかったため、現在の値が属しているグループ以外は背景色を薄くしてみました。
2023/11/29 更新: グラフの最大値と最小値を表示するように修正しました。
2023/11/30 更新: 範囲の設定方法を修正しました。


数値や金額の値によってグループ分けをしたりすることがあると思うのですが、「グループごとの数値の範囲や、現在の数値がどのグループに属しているのかパっと分かりやすくしたい!」と思い、上図のようなリニアゲージを表示する書式設定を作ってみました。

※上図なようなグラフをリニアゲージと呼ぶか、正確なことは不明です…Google で「Linear Gauge」と検索すると似たようなグラフが表示されるので、勝手にリニアゲージと呼んでいます😅

列の書式設定のコード

作成した列の書式設定のコードは、次の通りです。

書式設定適用方法

書式設定を適用するには、次の手順を実施します。

① コードの修正

書式設定のコードは、適用するリストに応じて修正する必要があります。

グラフ全体の最大値、最小値の変更

グラフ全体の最大値、最小値の設定は、コード内の 31 行目に記載されています。利用するリストに応じて修正してください。マイナスの値を設定いただいても問題ありません。

"forEach": "_overallRange in split('min:MIN_VALUE,max:MAX_VALUE','^')",

# Example 1
"forEach": "_overallRange in split('min:0,max:100','^')",

# Example 2
"forEach": "_overallRange in split('min:-150,max:250','^')",

# Example 3
"forEach": "_overallRange in split('min:0,max:1','^')",

各グループの数値範囲、背景色、グループ名の変更

各グループの数値範囲、背景色、グループ名は、コード内の 50 行目に記載されており、カンマ区切りで各グループの設定値が記載されています。利用するリストに応じて修正してください。

各グループの設定値は、次のように設定します。

"forEach": "_range in split('RANGE_MIN[<= or <]n[<= or <]RANGE_MAX:BACKGROUND_COLOR:RANGE_NAME',',')",

# Example 1
"forEach": "_range in split('0<=n<30:#9ED9D2:C,30<=n<80:#F7D358:B,80<=n<=100:#F4A7B9:A',',')",

# Example 2
"forEach": "_range in split('-99999<=n<0:#c190f0:D,0<=n<100:#9ED9D2:C,100<=n<200:#F7D358:B,200<=n<=99999:#F4A7B9:A',',')",

# Example 3
"forEach": "_range in split('0<=n<0.4:#9ED9D2:C,0.4<=n<0.8:#F7D358:B,0.8<=n<=1:#F4A7B9:A',',')",

以下は、設定例です。

# 設定例:HTML カラーコードを利用する場合
80<=n<=100:#F4A7B9:A

# 設定例:HTML カラーネームを利用する場合
30<=n<80:Yellow:B

# 設定例:グループ名を設定しない場合
50<n<=60:#00FF00:

# 設定例:グループ名に半角空白を利用する場合
90<n<100:#FFD700:Range_D

※2023/11/24 時点、split 演算子を利用して半角空白を含む文字列を分解すると、エラーが発生するバグ?があります。そのため、_(アンダーバー)を半角空白代わりに入力し、表示する際に replaceAll 演算子を利用して、_(アンダーバー)を半角空白に置換する処置を取っています。

※数値範囲は、リニアゲージの最小値以下、もしくは最大値以上を設定しても問題ありません。

② コードの適用

数値列の書式設定に、修正したコードを適用してください。

③ 列幅調整

リニアゲージは、列幅に応じて大きさが変わるようになっています。列幅調整後、コマンドバーに表示されているビュー名から、ビュー情報(列幅の情報)を保存してください。

以上の手順で書式設定適用完了です。