実績値と予定値を1つのグラフで表現する
グラフ作成の際、ある起点を軸に参照する項目を切り替えたグラフを見てみたいと思ったことはありませんか？
例えば先月までは売り上げの実績、それ以降は予算/予定金額を表示するなど。
先にイメージ図として出しておきます。
<イメージ図>
年月（2020年4月～2023年3月）を時間軸として、
・2020年4月～2022年2月までが売上の実績
・2022年3月～2023年3月までが予算
となっています。
このように1つのグラフで実績と予定を1つのグラフで表現する方法をお伝えします。
１．データの確認
まずは先に上げた例から売上の実績と予算がどのようなデータになっているのか確認します。
<売上と予算>
最初のイメージ図で表示したデータを売上と予算で分けた折れ線チャートになります。
売上は2022年3月以降0円となっており、予算は2023年3月まで予定が立てられているという状況です。
売上が立っている年月は売り上げの数値を表示し、
そうでない場合、つまり将来的な年月は予算を表示するといった形でグラフを作成していきます。
２．グラフの表示（メジャー値の設定）
チャート：折れ線チャート
軸：年月
までは売上や予算の折れ線チャートと同様です。
メジャー値は数式を使用してグラフに表現していきます。
■数式（メジャー値）
If(売上金額<=0, 予算金額, 売上金額)※予算金額、売上金額は各予算/売上をSumしたマスターアイテムです。
このように売上のない（=0）場合は予算金額、それ以外は売上金額とすることで年月ごとに条件を加味したグラフを作成することができます。
<作成チャート>
売上のない年月は予算の数値でグラフ化
しかし、このままではどこが売上実績でどこか予算なのか切れ目が分かりません。
なので切れ目が視覚的にわかるように色で分けていきたいと思います。
３．色の変更と見栄えの調整
最初のイメージ図に合わせるべく、売上実績は青、予算は赤に設定していきます。
色変更ということで、
プロパティパネル → スタイル → 色と凡例
から色の変更をしていきます。
<色の変更>
■数式
If(売上金額<=0, RGB(255,17,17), RGB(17,17,255))※IF条件はメジャー値と同じで、結果に対して色分けを行っています。
色の数値は任意なので、見やすいと思う色にして頂ければと思います。
RGB関数についてはページの最後に少しだけ補足しておきます。
これで色を変更することができました。
このままでも良いですが、グラフの線を太くして色の切替りをより見やすくしましょう。
プロパティパネル → プレゼンテーション → スタイル指定
→ チャートタブ → 線のオプションの線の太さ
から自分の見やすい太さにしてみましょう。
今回は太さを3にします。
⇩
こうすることで線が太くなり、色の変化も見やすくなったかと思います。
★補足：RGB関数について
RGBは色を指定する関数です。
Red、Green、Blue
の頭文字をとってRGBですね。
関数の中に入る数値は「0～255」です。
数値の指定によって細かい色調整もできますが、とりあえず赤青緑の色を付けたい！
といった場合はその色の数字を高く、それ以外を低くすれば3色の色を指定しやすいです。
<予算での例>
赤色を表現したく[RGB(255,17,17)]を指定
Red Green Blue
(255, 17, 17)
赤の数字を高く、緑と青の数字を低くすることで赤色にしています。
●表現したい色の数字を高く、それ以外を低く
を覚えておきましょう。いかがでしたか？
皆様のアプリ開発に少しでも役に立てれば幸いです。
以上です