MZ Platform工程管理作成チュートリアルⅣ

1.積上棒グラフによる負荷状況確認機能

［積上棒グラフ］を使い、日ごとの負荷状況を視覚的に把握できるようにします。

1. 積上げ棒グラフ部
データベースのtaskテーブルに格納したデータをプロジェクトごと、あるいは工程ごとの作業時間数を日付別に表示することができま す。
同じ日付の作業は積上げて表示され、一日の負荷状況を把握することができます。
どの日程に工程やプロジェクトの作業時間が予定されているか把握しやすくなります。
2. コンボボックスによる選択
工程別やプロジェクト別、または全体データに簡単に切り替えて表示できるように、 ［コンボボックス］を使い、表示項目を選択しています。

3. データの絞り込み
1. プロジェクト、または工程別の絞り込み
   データベースへの接続を頻繁に行わずに済むように、検索結果テーブルデータを取得した後、［テーブルサブセットフィルター］ を使って、絞り込みデータを取得します。
   プロジェクトや工程名が［コンボボックス］に表示され、選択したデータのみが表示されます。
2. 表示期間による絞り込み（次章で設定）
   日付を指定して、積上棒グラフの表示期間を指定できるようにします。
   日付の指定には［日時選択ダイアログ］での選択も可能です。
   必要な期間だけをSQL文で指定し取得します。

1.棒グラフ表示複合コンポーネントの追加

ここまでの『工程管理アプリケーション作成チュートリアルⅢ』では［タブ］を使用し、画面を切り替えて、機能ごとに見られるようにしていま す。
積上棒グラフもGUI複合コンポーネント内に入れ、タブで切り替えて表示できるようにします。

コンポーネント追加

1. GUI複合コンポーネントを追加します。
   ビルダー編集画面上で右クリック＞［複合コンポーネント作成］＞［GUIコンポーネント］を選択します。
   複合コンポーネントをダブルクリックして中に入り、コンポーネント名称を「積上棒グラフ表示部」に変更します。
2. 複合コンポーネント内部にコンポーネント追加します。
   

コンポーネント名	必要数	カテゴリー	ｺﾝﾎﾟｰﾈﾝﾄｷｰ／テキスト
GUI複合コンポーネント	1	複合コンポーネント作成	積上棒グラフ表示部
積上棒グラフ	１	画面構成部品＞グラフ	負荷状況
ボタン	1	画面構成部品＞ボタン	積上棒グラフ表示
ラベル	3	画面構成部品＞ラベル	プロジェクト選択 工程選択 全体データ
コンボボックス	3	画面構成部品＞コンボボックス	プロジェクト選択 工程選択 全体データ

画面配置

1. 部品をGUI複合コンポーネント画面に配置します。
1. GUI複合コンポーネント内部で画面編集画面に入ります。
   画面配置例を参考に、配置方法「手動配置」で［ボタン］を上部に、［積上棒グラフ］を下部に、中間部に［ラベル］と［コンボボッ クス］配置します。
2. タブ上にGUI複合コンポーネント画面を配置します。
1. 上位階層に移動し、画面編集画面に入ります。
2. 画面左側階層ツリー図の［タブ］上で右クリック＞［コンポーネント追加］＞［積上棒グラフ表示部］複合コンポーネントを選択 します。
   複合コンポーネントが［タブ］の階層下の3番目に配置されます。
3. ［実行（設定可）］ボタンで実行し、［タブ］のタイトルを「負荷状況表示」に変更します。
3. ［コンボボックス（全体データ）］に要素を追加します。
1. ［コンボボックス（全体データ）］を右クリック＞［要素］＞［一括追加…］を選択します。
   入力する 要素数を「２」とします。
2. もう一度［コンボボックス（全体データ）］を右クリックし、［要素］＞［編集...］を選択します。
   各要素の上で右クリック し、それぞれテキストを「日付別全工程」、［日付別全プロジェクト」とします。

取得した検索データ全体を積上げ棒グラフに表示して みます。
項目は日付とし、日付ごとにプロジェクトや工程をグラフで表します。
コンボボックスを使って系列の切替をで きるようにします。

１.全体データ表示機能

選択された系列のデータをグラフ表示します。

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加し、コンポーネントキーを変更します。

コンポーネント名	必要数	カテゴリー	コンポーネントキー
テーブル格納変数	１	処理部品＞変数	作業用
イベント生成	１	処理部品＞イベント	系列選択
等価演算（＝）	１	処理部品＞条件制御	列位置判定

接続処理設定

［ボタン（積上棒グラフ表示）］を押したとき、既定で日程別の全体工程データをグラフ表示するようにします。
［コ ンボボックス］の選択イベントをきっかけとして、グラフが表示される処理を作成します。
1. テーブルデータが設定されたタイミングで、メソッドでコンボボックスを選択する
1. 【接続2-1】コンボボックスを有効にする
   後で設定する終了処理で、終了時には無効にします。
   データが入った時点で有効にし、コンボボックスの操作ができるようにします。
2. 【接続2-2】コンボボックスの要素を選択する
   0番目の要素の「日程別全工程」を選択します。
2. コンボボックスの選択位置により、作成する系列グラフデータを選択する
［コンボボックス］の選択位置により、系列を替えた系列グラフデータを作成します。
［イベント生成］コンポーネントを使ってアクショ ンイベントを発生させ、イベント番号（＝項目選択位置）により行う処理を選択します。

1. 【接続3-1】テーブルを設定する
   作業用のテーブル格納変数にデータを設定します。
   ※［テーブル格納変数］からメソッド「テーブルを取得 する」で取得したデータを別の変数に入れ、一方の変数を変更するともう一方 のデータも変わってしまいます。
   これを避けるため、テーブルデータ取得にはメソッド「テーブルの完全な 複製を作成する（）」を使用します。
2. 【接続3-2】コンボボックスの要素の選択位置を取得して、アクションイベントを発生させます。
   引数に［コンボボックス］から要素の選択位置を取得して設定します。
   これにより［コンボボックス］の要素の選択位置が、アクションイベントに内包されるイベント番号になります。
3. 積上棒グラフ用データの作成
積上棒グラフは、［折れ線グラフ］などと同じ系列グラフの中の一つです。
項目に開始日、 系列に工程またはプロジェクト、 データに作業時間を指定します。

＜参考＞基本のコンポーネント＞ グラフ
＜参考＞ ＜参考＞グラフ化複合コンポーネントチュートリアル＞グラフ化複合コンポーネントの引数設定方法
1. 【接続4-1】工程を系列とする系列グラフ用のデータを作成します。
   項目（引数１）に「dateStart」列、系列（引数２）に「process」列を指定します。
   イベント番号：0を設定します。
   ［コンボボックス］の0番目の項目が選択されたとき、処理が行われます。
   テーブルデータは［テーブル格納変数（作業用）］から取得します。
2. 【接続4-2】プロジェクトを系列とする系列グラフ用のデータを作成します。
   項目（引数１）に「dateStart」列、系列（引数２）に「projectLabel」列を指定します。
   イベント番号：1を設定します。
   ［コンボボックス］の1番目の項目が選択されたとき、処理が行われます。
3. 【接続4-3】積上棒グラフにデータを設定します。
   メソッド処理結果で、作成された系列グラフ用データを引数に設定します。
4. 【接続4-4】積上棒グラフ用の色リストを設定します。

確認 ここまで設定し、実行してボタン（積上棒グラフ表示）］を押すとデータ設定例のようにグラフが表示されます。
項目の日付部分は日付データの文字表現形式になっていて、文字化けしたように見えますが正常です。

1.複合コンポーネントを使った日付の文字列変換処理

ここまでの処理では項目の日付部分が、日付型データをそのまま文字列に直した表現になっています。
［テーブル日付データ文字列変換］複合コンポーネントを使うと、書式を指定してテーブルの日付型列を文字列型に簡単に変換することが で きます。

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加し、コンポーネントキーを変更します。

コンポーネント名	必要数	カテゴリー	コンポーネントキー
サブルーチン	1	処理部品＞サブルーチン	日付文字列変換
テーブル日付データ文字列変換	１	複合コンポーネント追加＞テーブル

接続処理設定

1. 日付型列のデータを文字列型に置き換える
［サブルーチン（日付文字列変換）］を先頭に処理を設定します。
1. 【接続5-1】［テーブル日付データ文字列変換］複合コンポーネントにデータを設定し、書式を指定します。
   引数0にテーブルデータ、引数1に日付の書式「yyyy/MM/dd」を指定します。
2. 【接続5-2】変換されたテーブルデータを［テーブル格納変数］に格納します。
   文字列型に変更されたテーブルデータで［テーブル格納変数（作業用）］を上書きします。
2. サブルーチンを呼び出す
接続先は［コンボボックス（全体データ）］です。
1. 【接続3-3】処理を呼び出します。
   ドラッグして順番を入れ替え、［接続3-2］の［イベント生成］より前に処理を設定します。

ここまでの処理では項目のデータが存在する日だけ表示されるようになっていて、日付が飛んでいても連続しているように見えます。
［カレンダー］コンポーネントを使って連続した日付のリストを作成してグラフに設定し、一定期間内の負荷状況を把握しやすくします。

１.日付の連続リストの作成

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加し、コンポーネントキーを変更します。

コンポーネント名	必要数	カテゴリー	コンポーネントキー
サブルーチン	1	処理部品＞サブルーチン	連続日付リスト作成
リスト格納変数	１	処理部品＞変数	連続日付
カレンダー	１	処理部品＞システム　または 処理部品＞ユーティリティー	日付リスト作成

接続処理設定

［サブルーチン（連続日付リスト作成）］を先頭に処理を設定します。

1. テーブルから一番古い日付を取得し、［カレンダー（日付リスト作成）］に設定する
1. 【接続6-1】列を指定してソートします。
   一番小さい値の日付と大きい値の日付を取得したいので、先にソートしておきます。
2. 【接続6-2】セルを指定してデータを取得します。
   ソート後の0行目の開始予定日時データを取得します。
3. 【接続6-3】［カレンダー］に取得した日付を設定します。
   ※メソッド「Dateオブジェクトによるカレンダーの設定（Date)」はDate型のデータを引数に設定するメソッドです が、「yyyy/MM/dd」または「yyyy/MM/dd HH:mm:ss」などの一部書式に合う文字列も引数として設定できるようになっています。
2. 一番新しい日付までの日付リストを取得する
1. 【接続6-4】テーブルセルを指定してデータを取得します。
   ソート後の最終行の開始予定日時データを取得します。
2. 【接続6-5】［カレンダー］で引数に設定した日付までの日数を取得します。
   先に［カレンダー］に設定した一番新しい日付から、引数に設定した一番古い日付まで の日数を取得します。
3. 【接続6-6】日数分の日付のリストを取得します。
   一番値の小さい日付から始まる、指定日数分の日付リストが取得できます。
4. 【接続6-7】リストの要素を書式を指定して文字列型に変換します。
   取得したリストは日付型なので文字列に変換します。
5. 【接続6-8】作成したリストを［リスト格納変数］に格納しておきます。
3. サブルーチンを呼び出す

接続元は［サブルーチン（日付文字列変換）］です。

1. 【接続5-3】［サブルーチン（連続日付作成）］を呼び出します。
   ※この処理の呼び出し時点で［テーブル格納変数（作業用）］の「dateStart」列のデータは文字列型に変換済みで す。

［グラフデータ作成］複合コンポーネントで系列グラフ用テーブルデータを作成した後で、データに無い日付は行を挿入し、その行のセ ルに 日付を設定 します。

１.日付の追加

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加し、コンポーネントキーを変更します。

コンポーネント名	必要数	カテゴリー	コンポーネントキー
ファンクション	1	処理部品＞サブルーチン	連続日付追加
テーブル格納変数	１	処理部品＞変数	系列グラフデータ
リスト格納変数	１	処理部品＞変数	グラフ日付
繰り返し制御(For)	１	処理部品＞条件制御	日付リスト比較
文字列格納変数	１	処理部品＞変数	日付
比較演算（＜）	１	処理部品＞条件制御	indexOf

接続処理設定

1. 系列グラフ用データの日付リスト作成
［ファンクション（連続日付追加）］を先頭に接続処理を設定します。
※後で設定する「ファンクションの呼び出し」処理の引数には、［グラフデータ作成］複合コン ポーネントから系列グラフデータを取得し設定します。
1. 【接続7-1】変数にテーブルを設定します。
   引数には［ファンクション（連続日付追加）］の第一引数を取得します。
   ［ファンクション］の第一引数には呼び出し時に系列グラフデータを設定します。
2. 【接続7-2】位置を指定して列データを取得します。
   系列グラフ用テーブルの第0列目の日付列のデータを取得します。
3. 【接続7-3】列データリストを変数に格納します。
2. 連続した日付リストと系列グラフの日付リストの比較を繰り返し行う
1. 【接続7-4】繰り返し処理を設定します。
   先に作成した［リスト格納変数（連続日付）］の要素数分繰り返し処理を実行します。
2. 【接続8-1［リスト格納変数（連続日付）］の要素を取得します。
   順番に要素を取得します。
3. 【接続8-2】要素を変数に格納します。
   後で使うので、取得したリストの要素を一旦［文字列格納変数］に設定しておきます。
4. 【接続8-3】系列グラフの日付リスト（［リスト格納変数（グラフ日付）］）中に取得した日付と同じ要素があるか調べま す。
   メソッド「indexOf(object)」で該当する要素がある場合は位置番号が、無い場合は「-1」が返ります。
3. 位置番号を比較し、該当日付が無い場合、系列グラフ用テーブルデータに行を追加す る
1. 【接続8-4】比較演算を行います。
   メソッド「indexOf(Object)」の戻り値が0より小さい（＝「-1」）かどうか比較します。「-1」のときは該 当 データが無いということになります。
2. 【接続9-1】比較演算の結果が正のとき、［テーブル格納変数］内の系列グラフ用データに行を追加します。
     系列グラフの日付リストに日付が無いときに行を追加します。
   イベント番号１（演算結果が「true」のとき）を設定します。
3. 【接続9-2】追加した行のセルに日付を設定します。
   ［文字列格納変数（日付文字列）］に格納してあった文字列を設定します。
4. ファンクションの呼び出し
1. 【接続4-5】ファンクションを呼び出します。
   ここまで作成した［ファンクション］の処理は［グラフデータ作成］複合コンポーネントのメソッド「系列グラフテーブル作成 （Object,Object,Object,Object）」の処理が終わったタイミングで呼 び出します。
   接続元コンポーネントは［イベント生成（項目選択）］です。
   接続処理は【接続4-2】と【接続4-3】の間に設定します。
5. ［積み上げ棒グラフ］へのデータ設定の変更
1. 【接続4-3】積上棒グラフのデータ取得元を変更します。
   引数のテーブルデータを［グラフデータ作成］複合 コンポーネントから取得していたのを、［テーブル格納変数（系列グラフデータ）］からの取得に変更します。
   変数の中に日付を追加したテーブルデータが入っています。

確認ここまで設定すると、データ間の日付を埋めてグラフが表 示さ れます。

ここまではプロジェクトと工程の［コンボボックス］には何も項目が設定されていません。
検索テーブルのデー タからリストを取得して設定します。

1．項目リストの作成

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加し、コンポーネントキーを変更します。

コンポーネント名	必要数	カテゴリー	コンポーネントキー
ファンクション	1	処理部品＞サブルーチン	項目準備
リスト格納変数	１	処理部品＞変数	項目

接続処理設定

1. 項目リスト取得の準備

重複要素を削除してソートしたリストを取得します

1. 【接続10-1】検索結果テーブルの列データを取得します。
   引数は［ファンクション］の第一引数とし、後で［ファンクション］を呼 び出すときに、第4（PlojectLabel）列目、または第5（process）列目を指定します。
2. 【接続10-2】取得したリストを変数に格納します。
3. 【接続10-3】重複要素を削除したリストを取得します。
4. 【接続10-4】もう一度［リスト格納変数］に格納します。
5. 【接続10-5】要素をソートしたリストを取得します。
   ※処理要求イベントの接続処理の一番最後で戻り値のあるメソッドを実行 すると、その戻り値をファンクションを呼び出した接続処理で、メソッド処理結果として利用できます。
2. 項目リストの設定

接続元は［テーブル格納変数（検索結果）］です。

1. 【接続2-3】［テーブル格納変数］にデータが設定されたタイミングで、［ファンクション（項目準備）］を呼び出しま す。
   引数は固定値で「４」（projectLabel列）を指定します。
2. 【接続2-4】［コンボボックス（プロジェクト選択）］にリストを設定します。
3. 【接続2-5】［ファンクション（項目準備）］を呼び出します。
   引数は固定値で「５」（process列）を指定します。
4. 【接続2-6】［コンボボックス（工程選択）］にリストを設定します。

確認ここまで設定すると、２つの［コンボボックス］に要素が設定さ れま す。

［コンボックス］を選択すると、選択項目の要素名別に絞り込んだグラフを表示します。
データの絞り込みには ［テーブルサブセットフィルター］を使用して、テーブルの該当データがある行だけを選択して取得します。

１.［コンボボックス］の要素名による選択

コンポーネント追加

1. 複合コンポーネント内に以下のコンポーネントを追加します。

コンポーネント名	必要数	カテゴリー
テーブルサブセットフィルター	1	処理部品＞制御フィルター

接続処理設定

1. プロジェクト別の積上げ棒グラフ表示
［コンボボックス（プロジェクト選択）］のデータ選択イベントに処理を設定します。
1. 【接続11-1】［テーブルサブセットフィルター］に［テーブル格納変数（検索結果）］のテーブルデータを設定します。
2. 【接続11-2】［コンボボックス］で選択した項目の文字列でテーブルデータの行を選択します。
   引数0にproject列（第4列目）を指定します。
   引数1に［コンボボックス］の選択データをイベント内包で指定します。
3. 【接続11-3】選択されたデータを［テーブル格納変数（作業用）］に設定します。
4. 【接続11-4】［サブルーチン（日付文字列変換）］を呼び出します。
5. 【接続11-5】［イベント生成（項目選択）］を呼び出します。
   アクションイベントを発生させ、引数は「０」を設定します。
   プロジェクトで絞り込みされ、工程を系列とした系列グラフ用データが作成され、グラフに設定されます。
2. プロジェクト別の積上げ棒グラフ表示
［コンボボックス（工程選択）］のデータ選択イベントに処理を設定します。
【接続10】の接続をコピーして貼り付けると簡単です。
1. 【接続12-1】［テーブルサブセットフィルター］にデータベースの検索結果データを設定します。
2. 【接続12-2】［コンボボックス］で選択した項目の文字列でテーブルデータの行を選択します。
   引数0にproject列（第4列目）を指定します。
   引数1に［コンボボックス］の選択データをイベント内包で指定します。
3. 【接続12-3】選択されたデータを［テーブル格納変数（作業用）］に設定します。
4. 【接続12-4】［サブルーチン（日付文字列変換）］を呼び出します。
5. 【接続12-5】［イベント生成（項目選択）］を呼び出します。
   引数には「１」を設定します。
   工程で絞り込みされ、プロジェクトを系列とした系列グラフ用データが作成され、グラフに設定されます。