[Power BI] レポートビジュアルの作成時に考えること2022🤔

# はじめに

**Power BI レポートの作成、楽しいですよね**😁

レポートをつくるときにあーでもない、こーでもないと自分の好きな形に変えていく。

ところが、自分の好きな形式に作ることができる…というのは同時に、**答えのない旅**でもあります。

今回は**ビジュアル作成時に考えていること**を記事にしてみます。

# 免責事項

最終的に「おしゃれ」なレポートができるわけではありません😭

考え方の参考としてください。

また、**これが答えというわけではありません**。あくまでも、**「私」** の考えていることって感じです。

# 参考サイト

Power BIコミュニティの中に、いろいろな人が作ったレポートがみられる[データストーリーギャラリー](https://community.powerbi.com/t5/Data-Stories-Gallery/bd-p/DataStoriesGallery
)。

https://community.powerbi.com/t5/Data-Stories-Gallery/bd-p/DataStoriesGallery

[SQLBI](https://www.sqlbi.com/)にはビジュアル作成を勉強できるコースもあります。

https://www.sqlbi.com/p/power-bi-dashboard-design-course/

# 最初のビジュアル

こんなビジュアルから始めます。売上報告用のBIレポートとしては、まぁありそうな感じですよね😀
標準ビジュアルを並べただけで、ほとんど設定も変えていません。

データはContosoのサンプルデータを使用しています。

https://qiita.com/akihiro_suto/items/adce363d68d76a354723

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/0b52f15b-e079-1d46-ef11-544d28cda96b.png)

# まず考えよう🦾

まずは上のビジュアルをみて、自分ならどうするかなぁと考えてみましょう。

配色はデフォルトのテーマを使用していますので、いったん考慮外として。

月々の売上、またその推移をどう見せるか。カテゴリー別、ブランド別の売上をどう見せるか。

**いったん深呼吸して考えてみましょう🤔**

..

....

......

**では、はじめましょう。**

# 円グラフ、必要？

まず、気になるのは円グラフ。円グラフはよく見かけるビジュアルですが、あまりオススメとはいえません。
売上順に並んではいるものの、1位の売上と2位の売上、どの程度差があるのか一見わかりません。結局数字をみて頭で計算をしなければいけません。これは可視化としては失敗といえます。

<img width="500" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/daf2f000-165d-a505-ba0f-d7c1df2de2fd.png"></img>

ということで、円グラフは棒グラフに変更します。棒グラフに変更することで、各カテゴリーごとの売上をひとめで把握することができます。カテゴリー別売上は上位2項目の売上がほぼ同じで、3項目目は1位の半分くらいなんだな…とか、ひとめで洞察を得ることができますよね。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/919eb721-59da-4024-ce0d-94f2523f8bdf.png)

# 横棒グラフの改善

次に、横棒グラフを少し改善していきます。下位の項目はノイズになっている場合も多く、フィルターペインで設定をしてあげるだけで上位項目のみの表示に簡単に変更することができます。

下位項目の詳細を知りたい場合はドリルスルーや、別ページに別ビジュアルを作ってあげるなり方法を工夫したほうがいいでしょう。売上上位を示したいなら、売上下位は思い切って切り捨てるべきです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/412b470d-518b-2501-3c59-0b619e6dd128.png)

ここまでのことを適用したレポートは下図。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/d03581ac-424d-97e7-c3eb-f8196d01852b.png)

# グラフは”０”から

折れ線グラフなどの主にY軸。**ゼロから始めましょう**。

参考のレポートでも、折れ線グラフが「0.2M」から始まっています。**データがないなら省略していいじゃないか！** と思われるかもしれませんが、グラフの変化の仕方の角度が急に見えることになります。わかりにくいかもしれませんが、下図でも、右と左のグラフをみたときに、左のグラフのほうが変化が急に見えると思います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/2a68016a-bc22-281c-fcb0-9edf11ca75d2.png)

つまり、データをゼロからはじめないことで、誤ったデータの捉え方をしてしまい、誤ったビジネス判断をしてしまうことが起こりえます。特別な要件がない限り、**ゼロから始めましょう**。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/866b0235-b7e9-ae03-f380-a33159769f29.png)

# 桁数は丸める（KやMを使う）

次はカードビジュアルの表現です。カードビジュアルには小数点第2位まで数字が入っています。
今月の売上、今年の売上、そういった大枠を捉えたいときに、小数点以下まで数字は必要ですか？1,000以下の端数は必要ですか？１円、２円の変化がビジネス・インテリジェンス（BI）に必要ですか？

要件次第ですが、不要なケースが多いですよね。Power BIでは **「K」や「M」を使用して指定した端数以下を省略する**ことができますので、なるべく利用しましょう。今回は下3桁を省くために「K」を使用。小数点はそのまま残しましたが、これも消してしまってもいいかもしれません。

ちなみに、「K」や「M」は下表のとおり、キロやミリオンの略称表記です。**なぜか、1,000だけ、Thousandではないんですよね**😁Trillionと頭文字がかぶっちゃうから、馴染みのあるKが採用されたのかもしれませんね。

| 接頭語 | 正式表記 | 数値 |
|-|-|-:|
| K | Kilo | 1,000 |
| M | Million | 1,000,000 |
| bn | Billion | 1,000,000,000 |
| T | Trillion | 1,000,000,000,000 |



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/83747527-9d6d-e650-6186-344e1a7dc202.png)

実施するとこんな感じ。スペースも限りがあるので、横棒グラフ、折れ線チャートはサイズを変更して右側に寄せてみました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/054d0292-6bcb-6e56-55a4-9f2b77a17290.png)

# 電卓を使わせない😮

カードビジュアルには今月と先月の売上を表示しています。レポートの左上は最も最初に見られる場所なので、カードビジュアルで重要な指標を表示しているケースは多いですよね。そこで、現状の数字を表示するだけではなく、普段求められる**KPI**も表示してあげます。

**レポートをみながら電卓で計算をする…** なんてことがおこならないようにしてあげることが重要です🎉

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/5b9cc81d-9b48-e374-b337-3c8fd8293a02.png)

全体像は下図のようになってきました。おしゃれさは今回のスコープ外です。だんだん意味のあるレポートになってきましたよね？😀

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/69eccc1a-e7bc-d4d1-db9a-79ec10b2fe4e.png)

# ビジュアルにもコンテキスト

ビジュアルの作り方をいろいろなコンテンツでお勉強すると、「ビジュアルにはコンテキストが必要だ！」という言い方がでてきます。
コンテキストはPower BIを学んでいるとよくきく言葉ですよね。

## コンテキスト？🤔

https://eow.alc.co.jp/search?q=context

> **context**
**文脈、〔文中の言葉の〕前後関係**
・His words may sound offensive if taken out of context. : 彼の言葉は、文脈から切り離されると、無礼に聞こえるかもしれません。
・In what context should I use this word? : この単語はどのような文脈で使えばいいのですか？
**〔事件などの〕事情、背景、状況**
・In what context? : どういう事情で？
・Events in history are easier to understand if you know the context. : 歴史上の出来事は、その背景を知っているとより理解しやすい。

日本語で「文脈」とか「背景」などと訳される言葉のようです。

**正しい可視化をすることで、データに正しい洞察をえるためのコンテキスト（文脈・背景）が加わる** …という言い方でいいのかな🤔

# テーブルビジュアルにコンテキストを加える

テーブルビジュアルはよく使われますが、データの推移や傾向を知るためにはやはり不向きです。そこで、OKVIZからでているカスタムビジュアル、**Sparkline**を使用して置き換えてみます。

https://okviz.com/sparkline/

このビジュアルを使用すると、行ごとに、スパークラインを作成することができ、さらに最高点と最低点にマーカーをつけるなど、データのコンテキストを知るために良い機能が数多く含まれています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/904853e0-d832-6f29-f791-8bfab46bddb3.png)

あくまでも参考ですが、テーブルビジュアルは①のように最新の数字だけ表示させた上で、あとはすべてスパークラインに置き換えてしまっても良いかもしれません。そうすると、各カテゴリごとにいつ最高点で、いつ最低点なのか、そのタイミングに因果があるのかどうか、テーブルビジュアルで数字を羅列させたものよりも洞察を得られやすくなっていることがわかると思います。

#### 細かくデータを見たければ、テーブルを表示

スパークラインだけでなく、数字もみたい！というときは、②のようなビジュアルも考えられますし、**ビジュアルの3点リーダーからテーブルを表示**をしてあげると、通常のテーブルビジュアルで数字をみることも可能です。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/a752a704-1eb8-7a2e-e840-bd56b9c107aa.png" width="700"></img>　<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/63a88033-f3e9-50cc-c57d-b4b42e5d80eb.png" width="700"></img>

このあたりを適用すると、ビジュアルはこんな感じになりました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/855d3916-f957-1192-2841-a1670e97f60e.png)

# カードビジュアルも再考する。コンテキスト追加。

以前の手順で先月比を追加したカードビジュアル。こちらも売上の流れを把握できるように編集していきます。またまたOKVIZから**Card with States**というカスタムビジュアルをDLして使用します。**すべての機能を使用するには会員登録をする必要がありますが、無料です💪**

https://okviz.com/card-with-states/

このビジュアルを使用すると、カードビジュアルにトレンドラインを追加することができます。単一の数字を表示すると同時に、全体の流れがどうなっているのかを表示することができます。今の売上が、上昇基調なのか、下降基調なのかをひとめで判断することができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/434829fe-4ad9-ad3a-0298-9947d8d8b4bb.png)

## さらにカスタム

このビジュアルは簡単に様々な要素を加えることができます。さらにカスタムを加えて、**先月比**や**先月の売上**もひとつのカードビジュアルに加えてみましょう。

タイムインテリジェント関数を使用して、先月の売上を計算できるようにしておきます。

```
PM売上 = 
CALCULATE(
    [SalesAmount],
    PREVIOUSMONTH('Date'[Date])
)
```

このメジャーを「target」にいれてあげることで、カードビジュアルに今月の売上を表示しながら、先月の売上を今月の売上が上回ったら、トレンドラインを緑色にする…といった効果を付与することもできます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/57f0fb7b-ce15-b7b7-9b51-2536a6cf8a81.png)

ちょっとやりすぎかもしれませんが、全体像はここまで変化しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/364284e2-2b0f-fedc-1f4e-e55f64702203.png)

# スペースの有効活用も考える🤔

気づいたかもしれませんが、グラフの表示項目を減らしたり、数字の桁数を減らしたり、テーブルビジュアルで数字を全部表示することをやめていったときに、スペースが空いてきます。**レポートの表示面積は有限です**。スペースの有効活用は重要なテーマです。新しいページを追加する前に、今のレポートに無駄な要素、項目は本当にないのか検討しましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/5cfdd53f-a38c-53ac-f218-862b22ced2e2.png)

# ビフォーアフター

手順ごとの変化は小さいかもしれないですけど、ビフォーアフターを並べてみると変化の大きさをわかっていただけるのではないでしょうか🤔スペースが空いたので、さらに情報を入れ込むことも可能ですよね。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/d16ecfe0-b9e5-9e11-f7dd-2b46ba9d792f.png)

# まとめ

本記事で示したのはあくまでも一例です。自分の組織や環境、センス、一番いい形を探しましょう。
配色を工夫して、自作のカスタムテーマを作成してもいいと思います。

**レポート作成は自由だ！だからこそ難しくて🤔、だからこそ楽しい😀🎉**

最後までお読みいただきありがとうございます😀
**イイね** お願いします👍

**Happy Power BI !!**