Share!

「コンテナ」と言う機能を聞かれた事はありますでしょうか。「コンテナ」と言いますと、トレーラーが運んでいる荷物を積み込む大きな収納ですね。港に行けば、これらが多数積み上がっているシーンを見られたことがあるのではないかと思います。

そのコンテナのイメージの様にMotionBoardにアイテムを積上げる機能があります。MotionBoard でこの「コンテナ」の機能を活用できる様になると、さらに表現の幅が広がります。今回は、この辺りの解説を進めていきます。

メニュー画面(検索画面)をどう配置するか

160817ブログ図1小

まずは、上の画面を確認してください(クリックして拡大)。パレート図や積上げエリア、散布図やヒートマップまで、画面の中に多数配置されたボードとなります。

出来る限り画面の中に見やすくチャートを配置するには、こういった形になりますよね。ただ、このボードで抜けているとしたら、検索項目が配置されていないことでしょうか。

では検索項目を配置してみましょう。今回は複数のデータソースからなるチャートを一斉に検索で絞り込みますので、個別検索ではなく、全体検索を使用します。

ちなみに、個別検索全体検索については別のブログにて解説しておりますので、そちらを確認くださいませ。

では全体検索の項目を配置してみましょう。上部または、右端に検索項目を並べるのが通例ですので今回は上部に並べてみました。

160817ブログ図2

年、月、都道府県等今回は5つの検索項目を上部に配置しました。これで、チャートすべてがこの検索項目で絞り込むことが出来ます。

しかし、検索バーで画面の1割ほどが占拠されてしまいました。これはできればもっと小さくしたいものです。

小さくする方法はもちろんあります。検索項目をまとめあげ、ボタンを押すことにより、別ウインドゥで立ち上げるという手法です。ただ、ウインドウの中には検索項目を4つまでしか配置することが出来ません。今回は検索項目が5つ。つまり、2つのボタンを配置し、検索画面を別途立ち上げるようボタンを設置する必要があります。ボタンが複数になるため同時に5つの条件を横並びに見て、設定することは出来ませんし、検索項目が増えていくとボタンがドンドンと増えてくことになります。では他に、何か手は無いのでしょうか。

そこで、今回の「コンテナ」の機能が登場するわけです。

コンテナとは何か

160817ブログ図3

では、コンテナとはどういった機能でしょうか?

荷物のコンテナのようにアイテムを積上げることが可能となります。また積上げるだけでなく、複数のアイテムを固めて表示することが出来ます。まずは実際の画面を見ていただきましょう。上の図をご覧ください(クリックして拡大)。

これがコンテナを利用した検索画面の場合です。1つ前の図と変わりないと思われれるかもしれませんが、実は上段のチャートにかぶさって検索メニューが表示されているのが見てとれる思います。そうです。複数のアイテム (今回ですと、5つの検索項目と、左端の「閉」と書いたボタンの6つのアイテム)を一つのかたまり、「コンテナ」として作成しています。

それを表示/非表示切り替えのボタンを利用し、表示/非表示する形としているので、検索メニュー非表示の場合は1番はじめの例のように画面一杯にチャートを配置し、ボタンを押すことで、検索メニューをかぶせて表示させているというわけです。

「コンテナ」には、先程述べた検索項目を4つまでしか配置できないと言ったような制限は特になく、画面に収まる範囲で任意のアイテムを配置することが出来ます。

もちろん、このコンテナ自身をどこに配置するかは任意に設定することができ、特にレイアウトモードでは画面の中に多数のチャートを見栄えよく、どう収めればいいのか悩まれているユーザーには非常にうれしい機能です。

続いて、コンテナの具体的な設定方法をみてみましょう。

1 2

[著]Wingarc1st Official The BLOG編集部
本記事はウイングアーク1st株式会社の運営するThe BLOGに掲載された記事を許可を得て掲載しています。

この記事を読んだあなたにおすすめのタグ

この記事を読んだあなたにおすすめのタグ

「TheBlogArchive」ランキング

まだデータがありません。

人気のカテゴリ