3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Motionboardで時間帯別の実績件数と予定件数をリアルタイムに対比することを想定したチャートの作成

Last updated at Posted at 2020-10-06

はじめに

Motionboardは、「リアルタイム表示が得意」という特徴があります。
たとえば「IoTデバイスから数秒おきにデータをMotionboardへAPIを通して送り込んで、これを表示するとともにDBに永続化する」というような使い方も想定されているようです(IoTオプションという有料オプションだったとおもいます、うちの会社では導入してくれてませんので使えません、)

リアルタイムデータをそもそもどうこしらえるかはさておき、かつ今回は別に「リアルタイム分析」のような機能も使いませんので、リアルタイムでもなんでもないっちゃないのですが、リアルタイムっぽいことをMotionboardでやってみようとおもいます。

さて、今回は「日々の作業実績が都度DBに追加されていくようなデータ」を想定し、今時点でどのぐらいの実績が上がっているか、また予定件数と対比してどうなっているかを、リアルタイムに確認するようなグラフを作成してみます。
たとえば、現場での作業ログがリアルタイムにDBに追加されていって、この情報を、現場のデジタルサイネージでダッシュボード的に確認する、みたいな状況を想定しています。

例えばこんな感じに、作業ログを時間単位で集計し、かつ時間単位で立案されている作業予定にと突き合わせて確認する。かつ、現在時刻より右側は背景を灰色で塗りつぶす、みたいな感じのチャートを作ってみようと思います。
image.png

スクショもりもりで説明していきます。
当方の操作環境は時代遅れの5.7なので、「古っっっwwwwwwwwwwwww」と笑ってください。設定項目自体は6.0も6.1も一緒のはず……。間違ってたらご指摘お願いします。

データの準備

今回は演習用データを、Excelを使って勝手にこしらえさせてもらいます。
こんな感じに、1作業につき1レコードのデータが、作業のたびに都度追加されていく、みたいなテーブルを想定しています。
「作業日時」はさておき、「作業時間帯」というデータは、普通わざわざテーブルに組み込まないと思いますので、Motionboardのカスタム項目で作ればいいと思います。
今回はどうせ自分でテストデータをこしらえてExcelをデータソースとして使ってしまうので、あらかじめExcelで作ってしまいます。
image.png

Excelの数式はこんな感じでつくりました。
image.png

作業番号	作業者名	作業日時	作業時間	列1	列2	作業時間帯
1	作業者A	0.340277777777778	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D3,"hh:")	00-	=CONCATENATE(F3,G3)
2	作業者A	=D3+E3	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D4,"hh:")	00-	=CONCATENATE(F4,G4)
3	作業者A	=D4+E4	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D5,"hh:")	00-	=CONCATENATE(F5,G5)
4	作業者A	=D5+E5	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D6,"hh:")	00-	=CONCATENATE(F6,G6)
5	作業者A	=D6+E6	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D7,"hh:")	00-	=CONCATENATE(F7,G7)
6	作業者A	=D7+E7	=ABS(NORMINV(RAND(),0.0001,0.01))	=TEXT(D8,"hh:")	00-	=CONCATENATE(F8,G8)

これをExcelのピボットテーブルを使い、時間帯別に作業件数を集計してみるとこんなイメージになります。
image.png

また、時間帯別の作業予定もこしらえてみましょう。
image.png

実績を集計して累積を取った値と、予定の累積を取った値とをくっつけて、グラフにするとこんなイメージになります。
冒頭に貼ったグラフと等しいです。これをMotionboardで作ってみましょう。
image.png

Motionboardで実績データの集計

まず、データソースを作ります。
接続先を「ボード専用Excel」にして、Excelファイルをアップロードし、「読込設定」で適切な範囲を設定します。
image.png
image.png

次に、データソースエディタで以下のように設定します。
取り急ぎチャートの種類は「折れ線縦棒コンボ」にしておきます。
集計項目は何でもいいですが、とりあえず「作業番号」を「件数」で集計し、別名を「実績件数」としておきましょう。
image.png

また、「追加項目作成」で「事後集計項目」を追加し、「実績件数累計」を作っておきましょう。
image.png
image.png

そして、作成されたチャートにおいて、実績件数累計の「列スタイル」を「棒」から「折れ線」に変更すればOK。
image.png

image.png

image.png

Motionboardで予実データの集計

では次に、集計された実績データに対して、予定データを突合せたチャートを作ってみましょう。
今回は、「結合データソース」という機能を使おうと思います。

先ほどのデータソースをコピーして新しいデータソースにした後、データソースエディタを開きます。
データソース選択で、「DS1」の隣の「+」ボタンを押して、「DS2」を追加します。
image.png

追加したDS2でも同じExcelを選択し、次は予定データが書き込まれたシートのデータ領域を選択してOKします。
image.png

DS2のデータを取り込めました。
これで、DS1とDS2の集計を1つのデータソースファイルの中で同時に行えるようになります。
「実績件数」は、「表示」のチェックを外して非表示にしておきました。
image.png

結合データソースは、いまいちどう使っていいのかわかっていませんでした。
最近ようやく理解できるようなきがしてきていて、私は『DS1での集計軸(行と列)と、DS2での集計軸(行と列)が一致してさえいれば、違う情報源であっても、集計結果を重ね合わせて表現できる』というようなイメージで使っています。もし間違ってたらだれかコメントお願いします。
image.png

ちなみに、DS2のデータは事後集計項目は作成できないようなので、事前に集計しておきました。
image.png

このデータソースを使ってチャートを作ります。
折れ線チャートを指定してチャートを作成してみましたが、第2軸が自動的に設定されてしまったので、まずは軸を統一化させます。
チャートエディタから、共通設定-軸-数値軸の設定-表示を「1つに集約」にします。

image.png

チャートメニューの軸の設定から変更してもいいです
image.png
image.png

集約軸の名前がダサいので変更します
image.png

できました。
チャートのデザインがダサかったので、修正したところもスクショ貼っておきます。データポイントアイコンを追加したり、影消したり、色つけたりしています。
image.png
image.png
image.png
image.png

背景を塗りつぶす

背景を塗りつぶすには、まず先にユーザシステム変数で、現在時刻の変数を作っておきましょう。
私は以下のような変数を作っています。
image.png

次に、チャートエディタ-折れ線・棒系設定-行目盛り線の設定-行目盛り線を設定するを開きます
image.png
こんなかんじに設定します
image.png

すると、こんな感じのチャートになります。
image.png

今回のテストデータでは実績データをすべての時刻で入力してしまっているのですが、
想定では実績ログデータは、都度データが追加されていくことになります。

ただ、実績値は累積値を表示しているため、もし今が16:00時点だとして、17:00以降のデータがなかったとしても、16:00時点の累積値がずっと横に伸びて表示されてしまいます。
たとえば、実績データを16:00までのデータに絞ってみると、以下のチャートのように実績が入っていない部分も、ずっと右に伸びて表示されてしまいます。気持ち悪いですが仕方ない。なんとかする方法ご存じの方教えてください。
image.png
(2021/04/07 08:32 追記)
以下の記事を参考にすれば、横に伸びずに済むかもしれません。ご参考まで。
@Ryo---san MotionBoardでif文を書こう〜今のグラフをさらに見やすく美しく〜

アイテムのリフレッシュ間隔を設定

あとはアイテムプロパティのリフレッシュ間隔を適切な値に設定すれば、自動的にチャートアイテムが更新されるのではないでしょうか。
image.png

おわりに

需要あるのかな…
あとMotionboardを個人で使える感じのサービスとかないっすかね…
お目通しありがとうございました。

3
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
3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?