ガントチャート拡張機能

ガントチャート拡張機能

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

1. 概要  

ガントチャートは、プロジェクトのスケジュールを視覚的に表現する強力なプロジェクト管理ツールです。タスクの開始日と終了日をタイムライン上に並べて表示します。各タスクは、ガントバーと呼ばれる横棒で表されます。タスク期間、タスク同士の重なり、マイルストーン、期限など、さまざまな要素を示すことで、プロジェクト全体を俯瞰できます。このガントチャート拡張機能を使うと、Zoho Creator アプリケーション内でプロジェクトを効率的に計画・スケジューリング・追跡できます。


2. 主な機能
  

  • プロジェクトのタイムラインを可視化して効果的に計画し、プロジェクト完了までのおおよその期間を把握できます。

  • 値に基づいてタイムライン(ガントバー)にテーマや色を適用し、ガントチャートをカスタマイズして視認性を高めることができます。

  • プロジェクトのタイムラインを、など、さまざまな間隔で表示できます。

  • プロジェクトの進捗を追跡し、タスクの依存関係を管理して、プロジェクトを効率的に遂行できます。

  • 提供されるエラーログを確認することで、誤ったデータを検出して修正できます。

3. チャートの種類

この拡張機能では、フォームの設定に応じて 3 種類のガントチャートを利用できます。

 

種類 1: タスク一覧を表示する基本チャート

タスクの開始日と終了日を、シンプルな一覧として表示するチャートです。タスクのタイムラインだけを表示したいフォームに最適です。

 

種類 2: 複数プロジェクトのタスク一覧を表示するチャート

各プロジェクトごとにタスクのタイムラインを表示し、プロジェクト間を切り替えられるチャートです。プロジェクトごとに固有のタスクセットがあり、それぞれを個別に確認したい場合に最適です。



 

種類 3: 複数プロジェクトのタスクとサブタスク一覧を表示するチャート

各プロジェクトについて、タスクとそれに関連付けられたサブタスクを表示し、プロジェクトを切り替えられるチャートです。タスクとサブタスクを詳細に分解して確認する必要があるプロジェクトに最適です。



4. 拡張機能のインストール  

ガントチャート拡張機能をインストールするには、次の手順に従ってください。

  1. Zoho マーケットプレイスに移動します。

  1. 左上の 拡張機能 をクリックし、Zoho Creator を選択します。

  1. ガントチャート拡張機能を検索し、Install をクリックします。拡張機能をインストールするには、Zoho アカウントにログインしている必要があります。 

拡張機能のインストール方法については、こちらのページを参照してください。インストールが完了すると、拡張機能は Zoho Creator アカウントで利用できるようになります。

5. 拡張機能の設定    

種類 1 


この設定は、タスク一覧を表示するガントチャートに適しています。


1. 次の項目を含む新規フォームを作成します。

フィールド名

フィールドのデータ型

フィールドリンク名

説明

タスク名

単一行

Task_name

タスク名を保存するフィールド

開始日

日付

Start_date

タスクの開始日を保存するフィールド

終了日

日付

End_date

タスクの終了日を保存するフィールド 

 

2. ページに拡張機能を埋め込み、スクリプトを追加する

  1. ページビルダーを開き、ウィジェットとしてガントチャート拡張機能を追加します。

  2. 上部メニューのPage Variables and Scriptsアイコンをクリックします。

  3. [Add Variables] をクリックし、次の変数を追加します。
    変数名 - data
    データ型 - Text

  4. [Scripts] をクリックし、次のスクリプトを追加します。以下の表で説明しているとおり、パラメーターが正しいリンク名にマッピングされていることを確認してください。

input.data =

{

'reportName':'All_Tasks',

'chartSetup':{

'dateFormat': 'dd-MM-yyyy',

'項目':

{

'taskName':'Task_name',

'startDate':'Start_date',

'endDate':'End_date'

}

}

};

                      

パラメーター

説明

reportName

タスクレポートの名前

dateFormat

(任意)

アプリケーションの日付形式で、日付と時刻の設定で指定されているものです(アプリケーション設定)。

対応形式:
  1. dd-MM-yyyy(デフォルト)

  2. dd-MMM-yyyy

  3. MM-dd-yyyy

taskName

タスクフォーム内の「タスク名」フィールドのフィールドリンク名

startDate

タスクフォーム内の「開始日」フィールドのフィールドリンク名

endDate

タスクフォーム内の「終了日」フィールドのフィールドリンク名


 

3. データを追加してガントチャートを表示する

  1. アプリケーションの運用モードにアクセスし、タスクフォームにデータを追加します。

  2. レポートを開始日が昇順になるように並べ替えます。

  3. 拡張機能が埋め込まれているページをクリックします。ガントチャートが表示されます。

設定方法を見る

 

種類 2 


この種類は、プロジェクトに関連付けられたタスクの一覧を表示するガントチャートに適しています。このチャートでは、プロジェクトを切り替えて、そのタスクを表示できます。


1. フォームの作成

この種類には 2 つのフォームを作成する必要があります。


フォーム 1 - タスクフォーム

項目名

項目データ型

項目リンク名

説明

タスク名

一行テキスト

Task_name

タスク名を入力するための項目です。

開始日

日付

Start_Date

タスクの開始日を入力するための項目です。

終了日

日付

End_date

タスクの終了日を入力するための項目です。

プロジェクト名

ルックアップ

Project_Name

タスクが属するプロジェクト名を指定するための項目です。

 

フォーム 2 - プロジェクトフォーム

項目名

項目データ型

項目リンク名

説明

プロジェクト名

単一行

Project_Name

プロジェクト名を保存するための項目です。

タスク

サブフォーム

タスク

プロジェクトフォームからタスクフォームのデータを保存するためのサブフォームです。

 

制約事項: 開始日とプロジェクト名のリンク名は、すべてのインスタンスでそれぞれ Start_Date および Project_Nameである必要があります。これらが満たされている場合にのみ、ガントチャートは想定どおりに動作します。

 

2. 拡張機能をページに埋め込み、スクリプトを追加する

  1. ページビルダーを開き、ガントチャート拡張機能をウィジェットとして追加します。

  2. 上部メニューバーの Page Variables and Scripts アイコンをクリックします。


  3. [Add Variables] をクリックし、次の変数を追加します。
    変数名 - data
    データ型 - Text

  4. [Scripts] をクリックし、次のスクリプトを追加します。以下の表で説明しているとおり、パラメーターが正しいリンク名にマッピングされていることを確認してください。

input.data =

{

'parentReport':'All_Projects',

'reportName':'All_Tasks',

'relationLinkName':'Project_Name',

'chartSetup':

{

'dateFormat':'dd-MMM-yyyy',

'項目':

{

'taskName':'Task_name',

'startDate':'Start_date',

'endDate':'End_date'

}

}

};

 

パラメーター

説明

parentReport

タスクフォームで使用されている、プロジェクトフォームのルックアップ元となるレポート名を示します。

reportName

タスクレポートの名前。

relationLinkName

タスクフォーム内の、プロジェクトルックアップ項目のリンク名。

dateFormat

(任意)

アプリケーション設定の日付形式で、日付と時刻の設定として指定されている形式を使用します。アプリケーションのアプリケーション設定で確認できます。

対応形式:
  1. dd-MM-yyyy (初期設定)

  2. dd-MMM-yyyy

  3. MM-dd-yyyy

taskName

タスクフォーム内の、タスク名項目のフィールドリンク名。

startDate

タスクフォーム内の、開始日項目のフィールドリンク名。

endDate

タスクフォーム内の、終了日項目のフィールドリンク名。

 

3. データを追加してガントチャートを表示する

  1. アプリケーションの有効モードにアクセスし、「タスク」フォームにデータを追加します。

  2. レポートを開始日が昇順になるように並べ替えます。

  3. 拡張機能が埋め込まれているページをクリックします。ガントチャートが表示されます。 

設定方法を見る

  

種類 3 


この種類は、プロジェクトに関連付けられたタスクとそのサブタスクの一覧を表示するガントチャートに適しています。また、プロジェクトを切り替えて、それぞれのプロジェクト内のタスクとサブタスクを表示することもできます。

1. フォームを作成する

この種類では、3 つのフォームを作成する必要があります。


フォーム 1 - プロジェクトフォーム

項目名

項目データ型

項目リンク名

説明

プロジェクト名

単一行

Project_Name

プロジェクト名を入力するための項目です。

タスク

サブフォーム

タスク

プロジェクトフォームからタスクフォームのデータを入力するためのサブフォームです。

 

フォーム 2 - タスクフォーム

項目名

項目データ型

項目リンク名

説明

タスク名

一行テキスト

Task_name

タスク名を入力します。

開始日

日付

Start_date

タスクの開始日を入力します。

終了日

日付

End_date

タスクの終了日を入力します。

プロジェクト名

ルックアップ

Project_Name

タスクが属するプロジェクト名を指定します。

サブタスク

サブフォーム

Subtasks

特定のタスクに紐づくサブタスクを入力します。

 

フォーム 3 - サブタスクフォーム

項目名

項目データ型

項目リンク名

説明

サブタスク名

単一行

Subtask_name

サブタスクの名前を入力します。

サブタスク開始日

日付

Subtask_start_date

サブタスクの開始日を入力します。

サブタスク終了日

日付

Subtask_end_date

サブタスクの終了日を入力します。

プロジェクト名

ルックアップ

Project_Name

サブタスクが属するプロジェクト名を入力します。

タスク名

ルックアップ

Task_name

サブタスクが属するタスクを入力します。
(サブタスクフォーム側でも双方向ルックアップにする必要があります)

 

制約条件:

  • 開始日とプロジェクト名のリンク名は、すべてのインスタンスでStart_Date および Project_Nameである必要があります。これにより、ガントチャートが想定どおりに動作します。

  • サブタスクの開始日と終了日は、親タスクの開始日と終了日の範囲内に収まっている必要があります。

 

2. ページに拡張機能を埋め込み、スクリプトを追加する

  1. ページビルダーを開き、ガントチャート拡張機能をウィジェットとして追加します。

  2. 上部メニューバーのPage Variables and Scriptsアイコンをクリックします。

  3. [Add Variables] をクリックし、次の変数を追加します。
    変数名 - data
    データの種類 - Text

  4. [Scripts] をクリックし、次のスクリプトを追加します。以下の表で説明しているとおり、パラメーターが正しいリンク名にマッピングされていることを確認してください。

input。data =

{

'parentReport':'All_Projects',

'reportName':'All_Tasks',

'relationLinkName':'Project_Name',

'chartSetup':

{

'dateFormat':'dd-MMM-yyyy',

'項目':

{

'taskName':'Task_name',

'startDate':'Start_Date'

,'endDate':'End_date',

'subData':

{

'subReportName':'All_Subtasks',

'subRelationName':'Task_Lookup',

'subFields':

{

'subTaskName':'Subtask_name',

'subStartDate':'Subtask_start_date',

'subEndDate':'Subtask_end_date'

}

,

'増加':真

}

}

}

};

 

パラメーター

説明

parentReport

プロジェクトフォームのレポート名を示します。

reportName

タスクレポートの名前。

relationLinkName

タスクフォーム内のプロジェクト項目(ルックアップ)のフィールドリンク名。

dateFormat

(任意)

アプリケーションの日付形式として、日付と時刻の設定で指定されている形式。アプリケーション設定で定義されます。

対応形式:
  1. dd-MM-yyyy(デフォルト)

  2. dd-MMM-yyyy

  3. MM-dd-yyyy

taskName

タスクフォーム内の「タスク名」フィールドのフィールドリンク名。

startDate

タスクフォーム内の「開始日」フィールドのフィールドリンク名。

endDate

タスクフォーム内の「終了日」フィールドのフィールドリンク名。

subReportName

サブタスクフォームのレポート名。

subRelationName

サブタスクフォーム内のタスクルックアップフィールドのリンク名。

subTaskName

サブタスクフォーム内の「サブタスク名」フィールドのリンク名。

subStartDate

サブタスクフォーム内の「サブタスク開始日」フィールドのリンク名。

subEndDate

サブタスクフォーム内の終了日項目の項目名をリンクします。

 

 

3. データを追加してガントチャートを表示する

  1. アプリケーションの実行モードにアクセスし、タスクフォームにデータを追加します。

  2. レポートを開始日が昇順になるように並べ替えます。

  3. 拡張機能が埋め込まれているページをクリックします。ガントチャートが表示されます。

 

設定方法を見る

 

Notes
メモ: ここでは既存のフォームのみをサブフォームとして使用できます。インラインサブフォームはサポートされていません。

6. その他のカスタマイズ設定

この拡張機能では、さまざまなタスクを色分けして区別し、より視覚的にわかりやすいチャートにするためのカスタマイズ設定を提供します。

 

6。1  チャートテーマを設定する 

任意の色をチャートに設定して、より見栄えよくすることができます。チャートテーマを設定するには、次のスクリプトを追加します。

  1. 'theme': {

  2. 'color' : 'pink',

  3. 'fontColor' : '#FFF'
  4. }

上記のスクリプトは、拡張機能の色とフォントを設定します。
InfoInfo:  値は、カラーコードまたは色名のいずれかで指定できます。

6。2 ガントバーの色を設定する  

タイムラインに複数の色を設定して、さまざまなタスクを見分けやすくすることができます。チャートは、指定した複数の色をラウンドロビン方式で使用して、タイムライン(ガントバー)の色を決定します。たとえば、redbluegreenyellowの4色を指定した場合、バーはその順番で着色されます。以降のバーも同じ順番で色が繰り返されます。

  1. 'colors' : ['#ff793f', '#706fd3', '#6ab04c','#ffff00']

6。3  項目値に基づいて色を設定する 

項目の値に基づいてガントバーの色を設定できます。たとえば、タスクをステータス(項目)ごとに異なる色で表示したい場合、各ステータスに異なる色を割り当てることで実現できます。たとえば、保留中のタスクは黄色、進行中のタスクは青、完了のタスクは緑で表示するといった設定が可能です。

これにより、プロジェクトの重要なポイントをすばやく把握でき、情報を読み解く時間を短縮し、全体の視認性を向上させることができます。以下のスクリプトを追加し、好みに応じて色を設定してください。

  1. 'colors': {

  2. 'basedOn': 'ステータス',

  3. 'values': {

  4. '保留中': 'yellow',

  5. '進行中': 'blue',

  6. '完了': '#4CAF50'

  7. }

  8. }
  • basedOn - バーの色を設定する基準となる項目リンク名を指定します。

Info
上記 3 つのカスタマイズ用スクリプトは、すべてガントチャート用スクリプトの末尾に追加できます。

7. 注意点

Alert
  1. ガントチャートを効果的に表示するには、レポートを開始日で昇順に並べ替える必要があります。
  2. 'dateFormat' パラメーターは、最新バージョンのガントチャート拡張機能でのみサポートされます。旧バージョンでは、既定で 'dd-MMM-yyyy' の日付形式のみがサポートされます。拡張機能の更新について詳しくはこちらをご覧ください。