ガントチャートプラグインについて
kintone 上でガントチャートの作成・表示ができるプラグインです。
同じアプリで一覧別に複数のガントチャートを作成することができます。
設定動画
基本設定編
ガントチャートプラグインの基本的な設定をまとめた動画です。
動画の説明欄から見たいチャプターへすぐに飛ぶことができます。
設定方法
ここでは、設定手順を設定画面の画像とともに説明します。
すべての設定についてご説明していますが、必要な設定のみを左のメニューから選択いただきご設定ください。
補足
基本的な設定は下記動画の「プラグインの基本設定」をご確認ください。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter1. プラグインの基本設定」
-
ガントチャートのヘッダー項目を設定する
- アプリの管理者権限を持つユーザーで設定を開きます。
- 一覧タブを開きます。
- +ボタンで一覧(View)を作成します。
すでに一覧を作成している場合は、設定する一覧の「編集」ボタンをクリックしてください。
- 一覧名を編集します。ガントチャートを表示する一覧(View)の名前になります。
- レコード一覧の表示形式を編集します。
ガントチャートの左側に表示するヘッダー項目とする項目をドラッグ&ドロップしてください。
- 表示時にあらかじめレコードの絞り込みを行う場合は条件を設定してください。
同様に、あらかじめ任意の項目でソートを行う場合も項目と昇順/降順を選択してください。
(変更しない場合はレコード番号順に並びます。)
- 左上の「保存」ボタンをクリックして一覧の作成は完了です。
- 「アプリを更新」ボタンをクリックして、「OK」ボタンをクリックして更新してください。
- アプリの管理者権限を持つユーザーで設定を開きます。
-
プラグイン設定画面を開く
-
アプリにプラグインを追加する
- 左上の「プラグインの追加」ボタンをクリックします。
- 現在 kintone 上に取り込まれているプラグイン一覧が表示されます。
プラグイン一覧から、ガントチャートプラグインを選択(チェック)します。
注意
プラグイン一覧に該当のプラグインがない場合、事前にプラグインを kintone システム管理に追加する必要があります。
kintone ヘルプに沿って、ダウンロードセンターから取得したプラグイン(zip ファイル)を追加して下さい。
- 右下の「追加」ボタンをクリックします。
- 追加したプラグイン一覧に ガントチャートプラグインが表示されていたら、完了です。
- 左上の「プラグインの追加」ボタンをクリックします。
-
プラグインの設定を行う
- 歯車アイコンから設定画面を開きます。
-
新しくガントチャートを設定する(必須)
-
タスクの入力設定を行う(必須)
ここでは、ガントチャートタスクのデータを保存するフィールドの紐づけを行います。
プラグイン設定の「タスクフィールド設定」を開きます。- タスクを管理するテーブル選択してください。
以降のタスク設定は、ここで選択したテーブルに属するフィールドを選択してください。
- タスクタイトルにするフィールドを選択してください。
- タスクの期間とする開始/終了フィールド選択をそれぞれ選択してください。
- タスクに進捗バーを設定したい場合は、タスク進捗を保存するフィールドを選択してください。(任意)
※数値フィールドを選択してください。
- マイルストーン表示を設定したい場合は、マイルストーンかどうかを判定するフィールドを選択してください。(任意)
選択したフィールド(チェックボックス)のチェックの有無でタスク/マイルストーン表示を切り替えます。
ダイアログで設定したタスク色は、条件色より優先して色を設定できます。
※背景色・文字色はそれぞれ別のフィールドを選択してください。
- タスクダイアログから追加で編集したい項目がある場合は、「編集フィールド追加」ボタンをクリックしてください。(任意)
- 追加で編集するフィールドを追加してください。
「ダイアログ画面の 100%幅」を選択すると、ダイアログ画面の横幅いっぱいに入力幅を変更することができます。(任意)
- タスクの移動固定・追従
補足
下記動画から詳しい手順をご参照いただけます。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter2. タスクの移動固定・追従移動」-
タスク移動を「許可する」を選択することで、すべてのタスクをマウス操作で移動することができます。
またフィールドを選択することで、編集画面上からタスクの移動可否を設定できます。
- マウスでのタスク移動時の他タスク追従設定は、あるタスクを動かしたときに
他のタスクを連動して動かすかどうかの設定です。
タスクを「追従する」を選択することで、同レコード内のすべての他タスクを追従させることができます。
またフィールドを選択することで、編集画面上からタスクの追従可否を設定できます。
-
-
ここでは、タスクをフィールドでまとめたグルーピングバーを表示するかどうかを設定します。
グルーピングバーを表示する場合は「表示する」を選択します。
- グルーピングする項目を選択します。項目は複数選択できます。
図では、タスクの大項目+計画/実績の区分でグルーピングバーを表示します。
- 一覧表示時にタスクを折りたたんだ状態で表示するかどうかを選択します。
「折りたたむ」を選択した場合は、グルーピングバーのみ表示された状態で一覧を開きます。
※バーのクリックで、表示切替が可能です。
-
ここでは、タスクをフィールドでまとめたグルーピングバーを表示するかどうかを設定します。
- タスクを管理するテーブル選択してください。
-
表示レコード件数、日付範囲、タスクの入力形式、改行、ソートを設定する
ここではガントチャートの表示日付範囲やタスクの入力形式、改行形式といった詳細設定を行います。
プラグイン設定の「一般設定」を開きます。
ここでは、レコードをすべて表示するか、ページングして表示するかの設定ができます。
「ページングする」を選択するとガントチャート上部と下部にページネーションが表示されます。
補足
レコード数が多い場合、「ページングする」を選択して 1 ページあたりの件数を減らすことで、画面表示時の描画にかかる時間を短縮することができます。
「ページングする」を選択した場合は、合わせて「1 ページあたりの件数」も指定してください。 「ページングする」を選択した場合でも、ページネーションの全件表示ボタン機能で一時的に全件表示をすることが可能です。
- 初期の表示日付範囲を設定します。
ここで設定した日付範囲で毎回ガントチャートが表示されます。
コントロールパネルで都度、表示範囲を変更することも可能です。
- ガントチャートに表示する曜日を設定します。
ここでチェックを外した曜日列を非表示にすることができます。
非表示になった曜日は、ドラッグ&ドロップの操作で選択することができなくなります。
スケジュール上で重要な作業日(営業日)のみ表示したい場合にご利用ください。
- ※タスクの開始/終了フィールドを日時に設定した場合のみ
ガントチャートで管理する開始時刻と終了時刻を設定します。
ここで設定した時間の範囲外をグレーアウトして表示することが可能です。
設定しない場合は、24時間グレーアウトされない状態で表示されます。
- 表示スケール(時間、日、月、年等)を設定します。
表示日付範囲と同様にコントロールパネルで都度変更することも可能です。
チェックをつけることで、kintone「高度な設定」の第一四半期の開始月設定を元に ガントチャートの四半期スケールを設定することが可能です。
設定しない場合は、1月から第一四半期、半期が設定されます。
注意
ガントチャート表示毎にAPIリクエストが発生します。
一日のアクセス数が多いガントチャートの場合は、チェックをOFFにすることを推奨します。
※一日に実行できるAPIリクエスト数は制限がございます。
ここでは、ガントチャートへのタスクの入力形式を選択することが可能です。
ダイアログを表示するを選択した場合、タスクタイトルだけでなく、開始/終了日付、
進捗率等もガントチャート上から一緒に入力できます。
タスクタイトルが文字列(一行)フィールド、数値フィールドの時のみ、
タスクに直接入力する方式が有効です。
ここでは、タスクの表示形式を階段状に並べて表示する設定を行うことが可能です。
タスクを改行しない(初期設定の)場合、スケジュールをできるだけコンパクトに表示できるよう、
タスクを表示する行はタスクの前後と関係なく、空いたスペースに詰めて表示されます。
タスクを「改行する」を選択することで、タスクを階段形式に表示して
作業の流れをより直感的に把握できるような形式で表示することができます。
また改行表示時は、タスクの並び順は開始日または終了日の昇順/降順から選択することができます。
ここでは、タイトルをタスクバーの幅で省略表示するか、バーからはみ出して全文表示するか選択可能です。
タイトルをはみ出して表示する場合は、次のタスクが被らないように自動で改行が入ります。
「グルーピングする」を選択した場合、「グルーピング基準」のフィールド値によって
関連するタスクを近くに表示することが可能です。
図の場合、計画と実績がセットになったタスクを近くに表示するため、「タスク名」でグルーピングを行っています。
「ソートする」を選択した場合、「並び替え基準」のフィールド値によって昇順/降順で並び替えを行うことが
可能です。
「並び替え基準」のフィールドは、あらかじめ設定したタスクのタイトルフィールドもしくは
タスクの追加編集フィールドから選択可能です。
※「改行する」場合は開始日または終了日で並び替え後、ここで指定したフィールドで並び替えを行います。
※フィールドでの並び替え後は、テーブルの行順に沿って並び替えを行います。
-
ここではタスクの依存関係を矢印線で表現する設定を行います。
プラグイン設定の「依存関係設定」を開きます。- 「依存関係を有効にする」にチェックをつけます。
依存関係機能を有効にした際は、追従機能が無効になりますのでご注意ください。
- 先行タスクの情報を保存するフィールドを選択してください。
文字列(1行)フィールドのみ選択可能です。
※編集ダイアログに設定したり、他の設定で利用しているフィールドを設定したりしないでください。
- 「後続タスクの移動に含めない曜日」を設定します。
先行タスクの移動時に、依存関係のある後続タスクはまとめて移動することができますが、
移動する後続タスクがここで指定した曜日を含む場合、移動の計算から省くことができます。
(例)土日のチェックを外す場合
2025/01/09(木)~2025/01/10(金)の後続タスクが1日後方にずれる場合、
土日をタスクの期間としないため、2025/01/10(金)~2025/01/13(月)になります。
※設定しない場合は、2025/01/10(金)~2025/01/11(土)
注意
一般設定 > 日付表示 を設定している場合は、日付表示機能が優先され、機能を利用できません。
非表示の曜日は移動に含めません。(移動の計算から省かれます)
- 後続タスクの移動可否を設定します。
先行タスクの移動時に、移動させたくない後続タスクがある場合に設定します。
「後続タスク連動 許可フィールド選択」にて、連動するかどうかを選択できるチェックボックスフィールドを指定します。
フィールド値によって、後続タスクの移動を制御できるようになります。
- 後続タスクの移動可否を設定します。
後続タスクの移動可否操作について初期値を選択します。
「すべて移動する」の選択は、ユーザーが最初にガントチャートを表示した際に、
後続タスクがすべて移動できるモードで表示されます。
「フィールド値に従う」の選択は、後続タスクの移動がフィールド値によって制御されているモードで表示されます。
※ガントチャートの3点メニューからユーザー単位で変更可能です。
- 「依存関係を有効にする」にチェックをつけます。
-
ここではガントチャート上でタスクを絞り込むフィルターの設定を行います。
プラグイン設定の「タスクの絞り込み設定」を開きます。
補足
下記動画から詳しい手順をご参照いただけます。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter3. タスクの絞り込み」- 「フィルター追加」ボタンをクリックします。
フィルターを追加すると、「絞り込みフィールド 選択」フォームが表示されます。
- 絞り込みたいタスクのフィールドを選択します。
ここでは、タスクのタイトル、もしくはタスクの追加編集で指定したフィールドから選択可能です。
選択肢がない場合は 新しくガントチャートを設定する より、指定したい項目をあらかじめ設定してください。
- ガントチャート表示時にあらかじめタスクを絞り込む場合、ガントチャートの初期表示時に絞り込む値を選択します。
例えば、ユーザー選択フィールドの場合、「ログインユーザー」にチェックすることで
ログインユーザーのタスクのみをガントチャート上に初期表示可能です。
※「絞り込みフィールド 選択」で選択したフィールドのタイプによって選択肢は変わります。
- 「フィルター追加」ボタンをクリックします。
-
行ヘッダー(ガントチャート左側)の設定を行う
ここでは、ガントチャート左側の行ヘッダーに関する設定を行います。
プラグイン設定の「テーブル列設定」を開きます。
- アイコンボタンの表示/非表示を設定します。
非表示にしたいアイコン列がある場合は、チェックを外してください。
- ※ピン留め機能ご利用時のみ
ピン留め情報を保持するフィールドを選択してください。
チェックボックスフィールドの1番目の値のチェックの有無で判断します。
注意
ピン留め行は、ユーザー間で共有されます。ユーザー単位でのピン留めには対応していませんのでご注意ください。
また、ピン留め行は、依存関係機能が無効となります。
※ピン留めを解除することで、機能が有効となり依存関係線が表示されます。
- 行ヘッダーのマージを設定します。
マージ全体設定ではヘッダー全体で表示を省略(マージ)する設定ができます。
列単位でマージするかどうかを指定したい場合は、列設定追加ボタンをクリックして、
フィールド単位に表示を省略するかどうかを指定することができます。
補足
下記動画から詳しい手順をご参照いただけます。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter5. 管理項目のマージ」
- アイコンボタンの表示/非表示を設定します。
-
ここではコントロールパネルで表示するボタン等、ボタンの設定を行います。
プラグイン設定の「各種ボタン設定」を開きます。 -
ここではガントチャートの行を色付けする条件の設定を行います。
プラグイン設定の「行色設定」を開きます。- 行に差し込む交互色の設定を行います。「背景色」ボタンをクリックして色を設定します。
文字色も同様に設定します。
- 「初期値に戻す」ボタンで、デザインテーマに合わせた初期色に戻ります。
- 条件付き色設定を行います。「色設定追加」ボタンをクリックします。
- 書式変更フィールドを任意のフィールドにすることで選択したフィールド色のみ着色できます。
「行全体」を選択するとガントチャート右パネルを含めて一行すべて着色します。
「製品名」フィールドに着色した例
- 「背景色」ボタンをクリックして、色を設定します。文字色も同様に設定します。
- 「条件変更」ボタンをクリックします。
- 下記画面になるので、「条件追加」ボタンをクリックして条件を追加してください。
- フィールドを選択して条件を入力/選択してください。
- 条件を複数入力する場合は、すべての条件(AND 条件)を満たす場合か、いずれかの条件(OR 条件)を満たす場合か
を選択してください。
- 「適用」ボタンをクリックして、条件を設定に適応してください。
- 行に差し込む交互色の設定を行います。「背景色」ボタンをクリックして色を設定します。
-
条件別にタスク色を変更する
ここではガントチャートのタスクを色付けする条件の設定を行います。
プラグイン設定の「タスク色設定」を開きます。
補足
下記動画から詳しい手順をご参照いただけます。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter6. タスクの条件色」 -
特定の曜日、祝日の日付列に色をつける
ここではガントチャートの特定の曜日や日付列に色付けする設定を行います。
プラグイン設定の「特別日付設定」を開きます。補足
下記動画から詳しい手順をご参照いただけます。
(※注意:YouTubeの動画リンクになりますので、音量などにご注意ください。)
YouTube | kinveniシリーズ ガントチャート 設定手順動画「Chapter7. 特別日付色」- 特定の曜日の色設定を行います。
初期は、土曜日と日曜日にデザインテーマに合わせた初期色が設定されています。
また、ここで祝日色を一括で設定することも可能です。
「色設定追加」ボタンをクリックします。
- 「背景色」ボタンをクリックして、色を設定します。画像は水曜日に着色した例です。
「初期値に戻す」ボタンをクリックすると、デザインテーマに合わせた初期色に戻ります。
- 初期の特別日付色を選択します。「背景色」ボタンをクリックして、色を設定します。
文字色も同様に設定します。
- 初期値に戻すボタンで、初期色のオレンジに戻ります。
- 特別日付設定を行います。
日付(yyyy-MM-dd), 説明, 背景色(省略可), 文字色(省略可) のカンマ形式、複数ある場合は改行して入力してください。
背景色、文字色を省略した場合は特別日付色設定で設定した色になります。
- 祝日を設定した例です。
カラー名を利用して入力する場合は コチラ(外部サイト) を参考にしてください。
- 特定の曜日の色設定を行います。
-
表示レイアウトを変更する
ここではガントチャートのレイアウト、配色の設定を行います。プラグイン設定の「デザイン設定」を開きます。- ガントチャートのスタイルを設定してください。
※Lite版は④行高のみ設定可能です。
ここでは、ガントチャートの全体の幅(ピクセルもしくは%指定)と列幅、行高、
テーブルの表示領域が設定できます。
② テーブル表示領域と ③ 列幅はガントチャート上で自由に調整が可能です。
調整後はその幅が保持され、次回以降表示する際にユーザー単位で引き継がれます。
ここでは、左パネル(行ヘッダー)の文字、タスクバーのフォントサイズを変更することができます。
注意
ご利用のブラウザによっては、最小フォントサイズがございます。
最小フォントサイズよりも小さい値を指定した場合、設定が反映されません。
ここでは、日付ラベル選択時に表示できる日付選択線の表示形式を変更できます。
日付列に面で色づけする「列をハイライト」もしくは、「列に線を描画」のどちらかを選択できます。
ここでは、ガントチャートのスケジュールヘッダー色、初期の行交互色/曜日別色、ボタン色等を 決定する配色テーマが選択可能です。
テーマは、ベーシックテーマ、kintone デザインテーマ、クラシックテーマの 3 種類です。
利用シーン別に分けると、下記のイメージです。
タスクの視認性重視 → ベーシックテーマ
アプリ独自で設定しているkintoneデザインテーマ設定に合わせたい → kintoneデザインテーマ
ガントチャートv6.0.0以前のテーマを利用したい → クラシックテーマ
注意
デザインテーマを変更すると、曜日別色設定、行の交互色がテーマに沿った配色に上書きされます。
上記を独自に設定している場合は、あらかじめ設定内容を控え、テーマ変更後に再設定してください。
- ガントチャートのスタイルを設定してください。
- 歯車アイコンから設定画面を開きます。
-
プラグインの設定を保存する(必須)
-
プラグインの設定を他のアプリで使用する
-
一覧設定をコピーする
特別日付設定など、一覧内の共通で利用する設定を他の一覧設定にコピーします。
ここでは、「2023年度XXXプロジェクト」一覧から「2024年度XXXプロジェクト」一覧に
「タスク色設定」「特別日付設定」をコピーする例でご説明します。
対応フィールド
下記表がそれぞれの設定で対応しているフィールドです。
ヘッダー表示項目は、kintone 一覧上で表示でき、ガントチャートで表示できない場合に × としています。
また、kintone 一覧上で表示できない項目、編集できない項目は-としています。
タスクタイトル・編集可能項目は、テーブルに属する項目の対応を示しています。
フィールド | ヘッダー表示項目 | ヘッダー編集可能項目 | タスクタイトル項目 | タスク編集可能項目 |
---|---|---|---|---|
レコード番号 | 〇 | - | × | - |
作成者 | 〇 | - | × | - |
作成日時 | 〇 | - | × | - |
更新者 | 〇 | - | × | - |
更新日時 | 〇 | - | × | - |
文字列(1 行) | 〇 | 〇 | 〇 (自動計算対応) | 〇 |
リッチエディタ― | 〇*1 | 〇 | × | × |
文字列(複数行) | 〇 | 〇 | 〇 | 〇 |
数値 | 〇 | 〇 | 〇 | 〇 |
計算 | 〇 | - | × | - |
ラジオボタン | 〇 | 〇 | 〇 | 〇 |
チェックボックス | 〇 | 〇 | × | 〇 |
複数選択 | 〇 | 〇 | × | 〇 |
ドロップダウン | 〇 | 〇 | 〇 | 〇 |
日付 | 〇 | 〇 | × | 〇 |
時刻 | 〇 | 〇 | × | 〇 |
日時 | 〇 | 〇 | × | 〇 |
添付ファイル | 〇*2 | × | × | × |
リンク | 〇 | × | × | 〇 |
ユーザー選択 | 〇*3 | × | × | 〇 |
組織選択 | 〇*3 | × | × | 〇 |
グループ選択 | 〇*3 | × | × | 〇 |
ルックアップ | 〇 | 〇 *5 | × | 〇 *5 |
関連レコード一覧 | - | - | - | - |
テーブル | ×*4 | - | - | - |
ステータス | 〇 | - | × | - |
作業者 | 〇 | - | × | - |
レコード ID | - | - | × | - |
リビジョン | - | - | × | - |
カテゴリー | - | - | × | - |
*1 ガントチャートの行高は改行に対応していません
*2 ファイル名を表示します(ダウンロードリンクは付与されません)
*3 各フィールドのリンクは付与されません
*4 テーブルを一覧に設定した場合、From(最大値),To(最小値)が自動で入ります
*5 ルックアップは「コピー元のフィールド」が文字列(1 行)/数値フィールドの場合に編集可能です
ルックアップフィールド設定の初期の絞り込みは反映されません。初期のソートはレコード表示時に反映されます。
注意事項
- 新たにアプリにフィールドを追加した際は、一度アプリの保存を行ってください。
プラグイン設定で選択するフィールドは、アプリの保存後に反映されます。 - モバイルでもガントチャートをご確認いただけます。タスクの追加・変更等、操作に制限がございます。
- ゲストスペースに対応しています。
- タスクの設定はテーブルに属さないフィールドは設定できません。
- 管理項目の列幅は、個人のブラウザ単位で保持される仕様となっております。kintoneメニュー「現在の列幅をアプリ設定に保存」はガントチャートにご利用いただけませんのでご注意ください。