三島正裕のOffice365徹底活用編(第6回)~スマートフォンでExcel参照!?プラスPowerAppsの活用術~

こんにちは!クラウドビジネス担当の三島です。Office365徹底活用コラム6回目ということで、今回はPowerAppsを使ったグラフ作成についてお話をさせて頂きたいと思います。みなさんは仕事でExcelを使われていますか?表計算に帳票作成、作業管理にメモ書きに、あらゆる場面で活躍するExcelですが、私も業務で使わない日はないのではないかというぐらい毎日使っております。さて、そんな便利なExcelですが、移動中や待ち時間に、ふと内容を確認したいと思うようなときはないでしょうか。ノートパソコンを広げる余裕はないけれど、「確認したい部分だけを即座に確認出来る」そんなアプリがスマートフォンにあったら便利ですよね。そして、小さな画面に文字や数値を表示するだけでなくて、「一目で状態がわかるグラフ」もあると嬉しいですよね。

PowerAppsを使うとExcelファイルをデータソースに、表もグラフも表示可能なアプリが少しの作業で完成してしまいます。と、いうわけで今回はPowerAppsのデータテーブルとグラフ機能を使ったアプリの作り方を紹介させて頂きます。

PowerAppsでグラフを扱うためのデータ構造

PowerAppsには折れ線グラフ、棒グラフ、円グラフといったグラフパーツが用意されていますが、これらを扱うためには、データの構造が下記のようになっている必要があります。

・各系列が先頭行に入力されていること。

・ラベルが左端の列に入力されていること。

下図にある折れ線グラフと照らし合わせてみるとわかりやすいと思いますので参考にしてみて下さいね。

部署別の実績数値を折れ線グラフで表現する

それでは、Excelで作成した表からPowerAppsでグラフを作成してみたいと思います。最初に、サンプルデータとしてExcelファイル「実績管理.xlsx」を作成します。下図左上のように値を入力した表を用意し、範囲指定した状態で「ホーム」タブから「テーブルとして書式設定」を選択します。任意の書式を選択し、テーブル名を「Table1」として保存します。保存したファイルはOneDriveの任意の場所に置いて下さい。

PowerAppsアプリを作成します。Office365からPowerAppsを起動して、「ホーム」ボタンから「空白から開始」を選択。携帯電話レイアウトを選択して、「アプリの作成」ボタンを押します。アプリ名とアイコンを任意に設定してクラウドに「保存」をして下さい。

OneDriveに置いたExcelテーブルをデータソースとして接続します。PowerAppsの「ビュー」から「データソース」を選択して、OneDriveを選択。Excelファイルの保存先を選択して、表示されたTable1にチェックを入れます。データウィンドウに「Table1」が表示されていればOKです。

データテーブルを画面に追加して、Table1の内容を表示させます。「挿入」メニューより「データテーブル」を選択します。データソースは「Table1」を選択し、表示されたフィールド全てにチェックを入れるとTable1の内容が表示されます。初期状態では、各列の幅が大きく設定されていますので、スクロール無しで全ての列が1画面に収まるよう幅や文字のサイズを調節してください。下図では列の幅を100、文字のサイズを16に設定しています。テーブルの色は任意で問題ありません。

折れ線グラフの設定をします。「挿入」から「グラフ」ボタンより「折れ線グラフ」を選択します。サンプルデータを基にした折れ線グラフが表示されますので、プロパティの詳細設定より、ItemsをTable1に変更します。プロパティにある「系列の数」はグラフが対象とする系列の数を設定する箇所です。今回は部署数が5つですので「5」と入力します。「Xラベルの角度」は初期設定で「60」がセットされていますので、今回は「0」をセットします。「位置」や「サイズ」は任意で設定して下さい。

設定が完了すると、下図のようにグラフが完成していると思います。グラフの色は詳細設定にある「ItemColorSet」で指定します。系列順にRGBA値がカンマ区切りで設定されていますが、RedやBlueなど色名で指定することも出来ます。

選択した部署の実績を縦棒グラフで表示する

今度は縦棒グラフを作成して、データテーブルで選択した日付のデータのみをグラフ表示させてみましょう。下準備として、Screen2を作成しScreen1にあるデータテーブルをコピー&ペーストで持ってきてください。

縦棒グラフの作成方法も、先程作成した折れ線グラフの作成方法と基本は同じです。下図と同じように設定してみてください。先程と異なるのは詳細設定の「Items」にセットする値ですが、こちらではFilter関数も使用しています。ペーストしたデータテーブル(DataTable2)で選択したデータの「日付」と一致するデータのみをデータソースとするように設定しております。

円グラフを使って進捗率を表現する

今度は目標数値に対する実績数値の進捗率を円グラフで表現してみましょう。これまでとは少し複雑に感じるかもしれませんが、手順はそれほど多くありませんので、安心してついてきてくださいね。最初にScreen3を新規に作成します。続いてScreen1と同じ実績数値と、新規に作成した目標数値をそれぞれ「DataTable3_1」、「DataTable3_2」という名前でデータテーブルを作成します。続いて「Button3」という名前で「更新」ボタンを作成し、パラメータOnSelectにはClearCollect、Collect関数をセットしています。この関数を実行するとアプリ内にコレクションが作成されます。

コレクションとはデータを格納したグループのことですが、Button3を実行すると、下図左のような形でコレクションが作成されます。1レコード目に実績数値の合計、2レコード目に目標数値と実績数値の差の合計が部署毎にセットされます。ClearCollectでコレクションを新規作成し、Collectで作成したコレクションにレコードを追加しています。作成したコレクションをもとに円グラフを作成すると下図右のように、進捗率を表現した円グラフが出来上がります。円グラフの作成自体はここまでの手順で作成した折れ線グラフや縦棒グラフと同じ方法で作成することが出来ます。

ここまでの手順の内容では、更新ボタンを押さない限り画面にグラフは表示されませんが、画面を開いたと同時にグラフを表示させるにはButton3のOnSelectのパラメータと同じ内容をScreen3のOnVisibleにもセットします。

最後に、円グラフの中に部署名と進捗率を表示させて、リング状にアレンジをしてみたいと思います。作り方は下図の説明を参考にしてみて下さい。最初に部署Aのリンググラフを作成し、これをベースに部署B~Eも作成して並べます。

PowerBIのタイルを張り付ける

PowerAppsのコントロールにはPowerBIタイルも用意されています。ExcelシートをベースにPowerBI側でグラフを作成し、タイルとしてPowerAppsアプリに組み込むことも出来ます。

おわりに

今回はExcel資料の有効活用ということで、PowerAppsでのグラフ作成をとりあげてみたのですが如何だったでしょうか。基幹側でシステム化されていない数値の管理をExcelで代用されているケースはよく見かけるのですが、これらをスマートフォンで閲覧しようと思うと、結構操作が大変だったりします。組織で共有していて、書き込み頻度が比較的多いExcel資料を今回のようなカタチでアプリ化しておくと、隙間時間の有効活用にも繋がりますよね。データ構造を整えるのに、少しだけ手間が必要になるかもしれませんが、一度アプリを作成してしまえば定期的に作成する報告資料にも十分活用出来ると思いますので、ぜひ皆さんもトライしてみて下さいね。それでは次回もお楽しみに。

 

Related post

更新情報

最新コラム

  1. こんにちは。吉政創成の吉政でございます。 クラウドの市場データを追いかけている方は、そろそろ気…
  2. はじめに 今月発生しました台風21号、北海道胆振東部地震により被害にあわれました方に心よりお見舞い…
  3. こんにちは。吉政創成の吉政でございます。今日は「広告に頼るWebサイト集客はやはり厳しい件。コンテン…

ログインステータス

You are not logged in.
Return Top