LookerのCustom Visualizationのご紹介 Vol.2

1．はじめに

こんにちは、杉山です。
最近は暑い日と涼しい日と寒暖差の激しい日が続いていますね。。。皆さん体調にはお気を付けください！
今回は以前こちらのブログでご紹介した『Looker Marketplaceからインストール可能なCustom Visualization』のうち、まだ公開できていなかった8種類のビジュアリゼーションをご紹介したいと思います。
（2024/6/28現在、Gauge MultipleとGaugeはサポート対象外のため本投稿ではご紹介いたしません。）

2．内訳を可視化する

1：Aster

2つの評価基準（数値項目）を用いて全体的な評価及び内訳を表現することが可能です。

例）ECサイトの売上分析
売上高を弧、売上高に対して利益率を合わせた結果を面に表示し、面の部分にマウスをあわせると該当する各カテゴリの売上がポップアップされます。「Jeans」は売上も高く利益が高いですが、「Socks」は売上も低く利益が低いことがわかります。

2：Collapsible Tree

展開可能な階層データをツリー状に表現し、データの関連性を分析することが可能です。

例）ドラッグストアの購買分析
池袋店と品川店で販売されている「冷凍食品」を比較した結果、品川店の方が池袋店よりも豊富な種類の「冷凍食品」を販売していることがわかります。緑色の丸をクリックすることで展開、白色の丸をクリックすることで収束することが可能です。

3：Sunburst

ツリーマップに似た階層データ構造を表示するのに効果的で、内訳を円グラフのように表現することが可能です。

例）ドラッグストアの購買分析
中心に近い円グラフには「エリアごとの売上」を、外側の円グラフには「店舗ごとの売上」を表示し、円の中心部にはカーソルを当てている「エリアまたは店舗ごとの売上」が全体の何%を占めているかを表示しています。以下の場合、練馬区には豊島園店ともう一店舗あり、豊島園店では他エリアを含む全店舗に対して11.40%の売上があることがわかります。

3．比較を可視化する

1：Multiple

単一のタイル上で複数のメジャーを表示・比較することが可能です。

例）ドラッグストアの購買分析
「2020年の売上金額」と「2019年の売上金額」の2つの数値項目をデータに追加し、Exploreの編集からShow as comparison > Show as Value Changeを選択することで、画面右にある売上金額が昨年からどの程度増加したのかを表示することが可能です。その他比較項目に対し『何%増加したか』『何%倍増したか』も、単一値のビジュアリゼーションと同様に選択可能です。

2：Packed Bubble

円の大きさ・色の濃さで数値項目の比較を表現することが可能です。

例）ECサイトの売上分析
あるECサイトでは10代の「売上金額」が最も高く$335,328.78であることがわかります。カーソルを該当の円に合わせると、「売上金額」の下に175126.35287832425と表示されており、これは売上金額ともう一つ選択されている数値項目「粗利益」を表示しています。どちらの数値項目を基準として比較するかはExploreの編集画面から設定可能です。

4．その他

1：Cartoon

データを漫画調に表現することが可能です。

例）ドラッグストアの購買分析
「アイス」にマウスを合わせると、各カテゴリごとに色が分かれて数値が表示されます。内容は一般的な棒グラフと大差ありませんが、自社サイトへの埋め込み等するなどビジュアリゼーションに少し変化を与えたい際におすすめです。

2：Histogram

『棒グラフで表現されるヒストグラム』と『散布図で表現されるヒストグラム』の2つのグラフから、データの集中傾向や外れ値を視覚的に把握することが可能です。

例）ECサイトの売上分析
X軸を「売上金額」、Y軸を「粗利益」とし2つの数値項目の相関関係を日次単位で集計した結果を表示しています。レコード数の量は画面上部の青い棒グラフ、または画面右にあるCount of Recordsのヒートマップを基に散布図を参照することで確認できます。2つの数値項目は右肩上がりであるため、正の相関があることも散布図から読み取れます。

3：Image Carousel

ビジュアリゼーションとして画像を参照し、ギャラリー形式で表示することが可能です。

例）運送業者の走行分析
各画像はディメンション値によって定義され、画像URLまたはbase64でエンコードされた画像文字列によって表示されます。今回はCloud Strageを画像の格納先として利用しましたが、Google Cloud以外のストレージサービスでも画像URLが問題なければLookerで表示可能です。

5．さいごに

前回に引き続きLooker Marketplaceからインストール可能なCustom Visualizationをご紹介しましたがいかがでしたでしょうか？一目でみて分かりやすいグラフというのは意外と難しいかと思いますが、Custom Visualizationを活用することによって簡単に作成が可能です！Custom Visualizationを用いた実際のデモも別のブログでご紹介しておりますので是非ご覧ください。

Custom Visualizationを用いたデモブログはこちら↓
・Lookerによるコンタクトセンター分析　デモ動画

Custom VisualizationをJavaScriptで作成してみたブログはこちら↓
・LookerのCustom Visualizationを試す