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

1. 概要  

2. 主な機能  

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

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

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

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

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

3. チャートの種類

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

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

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

種類 2: 複数プロジェクトのタスク一覧

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

種類 3: 複数プロジェクトのタスクとサブタスク一覧

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

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

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

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

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

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

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

5. 拡張機能の設定    

種類 1 

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

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

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

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

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

input.data =
{
'reportName':'All_Tasks',
'chartSetup':{
'dateFormat': 'dd-MM-yyyy',
'項目':
{
'taskName':'Task_name',
'startDate':'Start_date',
'endDate':'End_date'
}
}
};

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

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

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

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

設定方法を見る

種類 2 

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

1. フォームの作成

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

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

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

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

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

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

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

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

input.data =
{
'parentReport':'All_Projects',
'reportName':'All_Tasks',
'relationLinkName':'Project_Name',
'chartSetup':
{
'dateFormat':'dd-MMM-yyyy',
'fields':
{
'taskName':'Task_name',
'startDate':'Start_date',
'endDate':'End_date'
}
}
};

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

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

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

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

設定方法を見る

種類 3 

1. フォームを作成する

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

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

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

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

制約事項:

• 開始日とプロジェクト名のリンク名は、すべてのインスタンスで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'
}
,
'増加':真
}
}
};

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

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

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

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

設定方法を見る

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

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

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

• チャートテーマを設定する

• ガントバーの色を設定する

• 項目値に基づいて色を設定する

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

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

Info:  値は、カラーコードでも、色名でも指定できます。

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

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

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

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

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

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

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

7. 注意点

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

8. 関連トピック

• 拡張機能のインストールと管理

• ページスクリプトと変数