はじめに

多くのご要望にお応えする形で、やること「ガントチャートをメニュー位置に表示する」を 2021年7月のアップデートで追加させていただきました。

この記事では、「ガントチャートをメニュー位置に表示する」の基本的な使い方とともに、少し使い勝手を向上させるためのコツも合わせてご紹介します。

カスタマイズのイメージを掴んで頂く為に完成イメージを示します。やること「ガントチャートをメニュー位置に表示する」では、次のようなガントチャートを作成いただけます。

想定するアプリ

■使用するアプリ

すぐにお試しいただける例として、kintone アプリストアにある「ToDo」アプリをそのまま使用します。

■使用するフィールド

新たにフィールドを追加していただく必要はありませんが、最初のカスタマイズで使用するのは次のフィールドです。

フィールドタイプ	フィールド名	フィールドコード
文字列（1行）	ToDo名	To_Do
日時	開始日	From
日時	終了日	To

■使用する一覧

ガントチャートを表示するための一覧を新たに作成します。今回は「ガントチャート」という一覧名で以下のような一覧を作成しておきます。一覧に表示するフィールドは自由に設定いただいて構いません。

■使用するレコード

アプリストアから追加した Todo アプリにはレコードが入っていないため、例として以下のようなレコードを kintone に予め登録しておきます。

カスタマイズ作成手順

単純にガントチャートを表示するだけのカスタマイズは非常にシンプルで、以下の 2 アクションで作成が可能です。

それぞれのアクションについて見ていきましょう。

ガントチャートに表示したいレコードを準備する

まず、アクション１で、ガントチャートに表示したいレコードを予め取得します。

今回の例では、やること「全レコードを取得する」を使用していますが、条件で絞り込んだレコードのみをガントチャートに表示したいときには、やること「キーを指定してレコードを取得する」や「クエリで条件を指定してレコードを取得する」などを使用することも可能です。

また、条件は「一覧画面を表示した時」に加えて追加の条件として「現在の一覧が指定の一覧ならば」を設定しています。後ほど注意点・コツにて詳しく記載しますが、「一覧画面を表示した時」のみを使って常時動く設定にはせずに「現在の一覧が指定の一覧ならば」などを使って、特定条件下でのみ動くようにすることを強く推奨します。

ガントチャートを表示する

続いて、アクション 2 でガントチャートを表示します。

やること「ガントチャートをメニュー位置に表示する」で設定すべきパラメータとその意味を以下に記載します。

パラメータ名	設定例	設定すべき内容
場所	一覧画面メニューの下側	ガントチャートを表示する位置を指定します。一覧画面メニューの下側、レコード詳細メニューの上側が選択できます。今回は一覧画面メニューの下側を選択します。
チャートのタイトル	（設定無し）	ガントチャートのタイトルとして表示する内容を設定します今回は設定しません。
レコード	1	ガントチャートに表示したいレコードのアクション番号を指定します。該当のレコードは予め取得しておく必要があります。今回は、アクション：1 で取得した全レコードのガントチャートを表示するため、「1」を指定しています。
セクション	（設定無し）	ガントチャートを複数のセクションに区切って表示するときに指定します。今回は設定しません。
タイトル	ToDo名	ガントチャート内で表示するタイトルとなるフィールドを指定します。
開始日	開始日	ガントチャートの開始日となるフィールドを指定します
終了日	終了日	ガントチャートの終了日となるフィールドを指定します
クリックしたときの動作	別タブで詳細画面に遷移	ガントチャート内で特定のレコードをクリックした際の動作を指定します。デフォルト値は「同じタブで詳細画面に遷移」ですが、今回は「別タブで詳細画面に遷移」に変更します。その他、詳細画面ではなく編集画面に直接遷移してレコードを編集することも可能です。