LoginSignup
5
2
マナビDX Questで得たものAdvent Calendar 2023Day 23
@Kohei_Fujita(藤田 講平)

Power BI Dashboard作成手順(地図を含んだ施設情報の可視化について)

Last updated at Posted at 2023-12-22

はじめに

本手順は2023/3に行われた
「【オープンガバメント推進協議会】オープンデータ可視化チャレンジコンテスト」
で私を含む 「地域DXコミュニティ」 名義で運良く最優秀賞をいただけた　​​
「奈良市ワーケーション活用マップ」
の作成手順について、簡単に紹介いたします。

注意　本ダッシュボードは2023年03月の情報で作成しています。その後のアップデートなどで方法が変わる場合があるので留意してください。

ダッシュボード概要：どんなレポートにしたいか？

以下のようにデータを絞り、また絞った内容を表示させるようにする。
挿絵1.png

データテーブルの構成

ベースデータ：データ本体
(カテゴリー／サブカテゴリー／施設名／緯度経度などすべての情報を収めている）
カテゴリーマスター：カテゴリーだけをまとめたもの
（スライサーでカテゴリーを選んでも、ほかのカテゴリーが消えないようするするためにマスターを分けている）
(分類マスター)：サブカテゴリーでもカテゴリー同様のことをしようとした（ただしサブカテゴリーはデータの選択方式で消えないようにできたため不要だった）またDAX関数のトライのために作ったが実際には使われていない。
挿絵2.png

レポートの作り方

  • EXCELデータの調整
    元となった、奈良市オープンデータ、公共施設一覧が施設名や緯度経度などしっかりしたデータであったので
    それをベースに
    ①他のデータ（テレワーク施設や一時保育など）を形式を合わせて一つに
    ②カテゴリーデータ用の列挿入、各アイテムに公共施設のPOIコード*説明などをもとに付与した。
    ③POIコードではうまく表現できない部分や追加したデータなど分類(サブカテゴリー)として列を導入し、付与した。
    挿絵3.png

POIコード
政府公開のオープンデータの推奨データセットの公共施設種別コード（POIコード）に従ったものと思われる。
参考：川崎市　公共施設のオープンデータについて
https://www.city.kawasaki.jp/170/page/0000116229.html

  • EXCELデータの調整　その２
    作成したカテゴリー列を別シートにコピーし、重複データの削除などを実施し
    カテゴリーマスターを作成する。
    挿絵4.png

  • EXCELデータのインポート
    Power BIを起動し、ポップアップする画面上で、「データを取得」を選択
    その後「データを取得」のウィンドウでExcelブックを選択し、「接続」をクリック
    挿絵5.png

  • EXCELデータのインポート　その２
    「開く」のウィンドウで対象のExcelのファイルを選択し、「開く」をクリック
    ナビゲーターでファイルに含まれるシートがすべて表示される。
    挿絵6.png

  • EXCELデータのインポート　その３
    ナビゲーターで読み込むシートをチェックで選び
    「データの変換」をクリック、PowerQueryを起動させる。
    挿絵7.png

  • EXCELデータのインポート　その４
    PowerQuery上データを修正、
    ヘッダーが適用されていない場合、「一行目をヘッダーとして使用」をクリックして、ヘッダーを適用する。
    挿絵8.png

  • EXCELデータのインポート　その５
    またデータエリア外の空白行が取り込まれてしまっている場合、そのままデータを取り込んでも、取り込めない
    挿絵9.png

  • EXCELデータのインポート　その６
    行の削減＞行の削除＞空白行の削除をプルダウンで選択し、完全な空白行(＝データ対象外)を削除する。
    挿絵10.png

  • EXCELデータのインポート　その７
    閉じて適用で変更、削除を適用する
    挿絵11.png

  • EXCELデータのインポート　その８
    もし取り込んだ後でデータの転送がうまくいかないなどの問題があった場合、データ上の問題のあるシートを選択
    右横に表示される「・・・」を選択、「クエリの編集」でPowerQueryを立ち上げて再度編集を行う。
    挿絵12.png

  • データテーブルの設定
    カテゴリーマスターの値で、ベースデータのデータがソートできるようにカテゴリーマスターとベースデータに関連（リレーションシップ）を作成する。
    挿絵13.png

  • データテーブルの設定　その２
    リレーションシップの作成の画面が変化し、テーブルの選択画面になるので、プルダウンで、対象テーブルを選択、今回の場合、2つしかテーブルがない、また総合に同じ「カテゴリー」の項目があるため、片方のテーブルを選べば、自動で内容が決まる。「OK」で確定する。

挿絵19.png

  • データテーブルの設定　その３
    リレーションシップの管理でリレーションシップの一覧画面に戻るので
    これでOKなら、「閉じる」で完了し、リレーションシップ（テーブル同士の関係）を確定する。
    挿絵20.png
  • データテーブルの設定　補足
    なぜ「1対多」？
    挿絵21.png
    手動以外にも、以下の部分で自動検出での関連付与が可能。
    ただし、意図した通りになるかは、データの項目の記述によるので、この例のような簡単な関係であれば自動で問題ないが複雑なものであれば難しいかも。
    挿絵22.png
  • マップの挿入
    まず、地図で位置を表示することで対象を表示するため、視覚化＞マップ(地球儀のマーク)をクリック
    挿絵23.png
  • マップの挿入　その２
    ページにマップ領域①、視覚化の下に場所や判例などの入力画面②が出てくる。
    挿絵24.png
  • マップの挿入　その３
    判例に分類（＝サブカテゴリー）
    緯度、経度にそれぞれ緯度経度をドラッグアンドドロップで適用する。
    挿絵25.png
    挿絵25-1.png
    ただ緯度、経度を適用すると「緯度の平均」「経度の平均」といった計算が適用されるので、それぞれの右横のプルダウンを選び、「集計しない」として、計算しないようにする。
    挿絵26.png
  • マップの挿入　その４
    マップのビジュアルの書式設定
    ビジュアルタブを選び、設定。
    挿絵27.png
  • マップの挿入　その５
    注意点として、マップ背景の設定
    挿絵28.png
  • スライサーの追加
    まず、カテゴリー(大分類)でソートをマップの表示を絞り込むためのスライサーをクリックして追加する。
    挿絵29.png
    挿絵25-1.png
  • スライサーの追加　その２
    ページにスライサー領域①、視覚化の下にソート対象のフィールドなどの入力画面②が出てくる。
    挿絵30.png
  • スライサーの追加　その３
    データの中から「カテゴリーマスター」＞「カテゴリー」を選択、ドラッグアンドドロップでフィールドエリアへ適用する。
    スライサーに適用した「カテゴリー」の項目が表示される。
    挿絵31.png
  • スライサーの追加　その４
    ビジュアルの書式設定でスライサーの見た目の修正を実施
    スライサーの種類、スライサーヘッダーをオフにしスライサーの表題を表示しないようにし、スライサーのフォントなど修正、全体のイメージを統一していく
    挿絵32.png
  • スライサーの追加　その５
    次にカテゴリーで絞り込んだ後に、分類(サブカテゴリ)、さらに施設名称などで絞り込めるスライサーを作成する。
    視覚化から、スライサーをクリック
    挿絵33.png
  • スライサーの追加　その６
    ページにスライサー領域①、視覚化の下にソート対象のフィールドなどの入力画面②が出てくる。
    挿絵34.png
  • スライサーの追加　その７
    データの中から「ベースデータ」＞「分類」を選択、ドラッグアンドドロップでフィールドエリアへ適用する。
    さらに「名称」を選択し、同じようにフィールドエリアに適用する。
    スライサーに適用した「分類(サブカテゴリー)」の項目が表示される。さらにプルダウンで「名称(施設名称)」が用意される。
    挿絵35.png
  • スライサーの追加　その８
    ビジュアルの書式設定でスライサーの見た目の修正を実施
    (その４と同じ）
    挿絵36.png
  • リストの追加
    絞った結果、マップに加え、施設名称、住所、電話番号、利用可能曜日、開始時間、終了時間といった補足情報を得ることができるようリストを追加する。
    「視覚化」より「テーブル」をクリックする。
    挿絵37.png
  • リストの追加　その２
    ページにテーブル領域①、視覚化の下に表示対象の“列”の入力画面②が出てくる。
    挿絵38.png
  • リストの追加　その３
    まずデータの中から「ベースデータ」＞「名称」を選択、ドラッグアンドドロップで“列”エリアへ適用する。
    さらに「住所」、「電話番号」、「利用可能曜日」、「開始時間」、「終了時間」の順に同じように列エリアへ適用。
    挿絵39.png
  • リストの追加　その４
    もし列エリアのデータの順番が違っている場合、ドラックして、移動させることで、順番を修正可能
    挿絵40.png
  • リストの追加　その５
    ビジュアルの書式設定でテーブルの見た目の修正を実施
    列見出しおよび値のフォントサイズを上げて見やすくする。
    挿絵41.png
  • リストの追加　その６
    テーブルのサイズを調整し、レイアウトを整える。
    挿絵42.png
  • ビジュアル(見た目)の調整
    キャンパスを選択(スライサーなど何もない部分）をクリック
    「視覚化」にページの書式設定、キャンパスの背景を選ぶ
    挿絵43.png
  • ビジュアル(見た目)の調整　その２
    「視覚化」にページの書式設定、キャンパスの背景でカラーのプルダウンを実施、色のパレットが表示されたら「その他の色...」をクリック
    挿絵44.png
    色の調整画面が表示されると16進の色コードを入力し、目的の背景色にする。
    桜色を選択　#FFDBED　にする。
    挿絵45.png
    参考：Encycolorpedia
    桜色／#ffdbed十六進の色コード
    https://encycolorpedia.jp/ffdbed
  • ビジュアル(見た目)の調整　その３
    背景を設定すると、マップやスライサーなど四角く浮き出して見栄えが良くない
    そこで外形の領域を半透明にして、自然な感じにする作業を行う。
    挿絵46.png
  • ビジュアル(見た目)の調整　その４
    マップ、スライサー、テーブルの背景を半透明*(80%透明な白)にしておく
    挿絵47.png
    *背景色が透けるようにし、見た目を自然にする。
    挿絵48.png
  • ビジュアル(見た目)の調整　その５
    表題を挿入するため、テキストボックスをクリック
    表示される入力欄に表題名を入力する。
    挿絵49.png
  • ビジュアル(見た目)の調整　その６
    テキストサイズ、太文字、細文字、配置などを調整、位置も表題位置へ動かし調整する。
    挿絵51.png
  • ビジュアル(見た目)の調整　その７
    書式を選び、「効果」、「背景」を選び、背景の投下性を100%とし透明にする。
    挿絵52.png
  • ビジュアル(見た目)の調整　その８
    ここでイメージをクリックすれば、ロゴマークや市章など飾りを挿入できる
    (ただし背景が透明化されていないと前述のマップやスライサーのように
    背景色(白など)が浮き出して見栄えが悪くなる)
    挿絵53.png
    注意点として、もちろん今回コンペというクローズドな範囲であり、見栄えを良くするため市章を使わせていただいたが、ロゴマークなど知的財産権、著作権に留意して使用が必要であり、許諾の取得など必要な場合は実施する
5
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
5
2