--- title: Vizlib Gantt 機能説明＆ガントチャート作成手順説明（サンプルデータ付き） description: Vizlib Gantt 機能説明＆ガントチャート作成手順説明（サンプルデータ付き） image: https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_ColorGroup.png --- ![INSIGHT LAB_文字のみ_WHT-1](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF_WHT-1.png?width=400&height=110&name=INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF_WHT-1.png) ![INSIGHT LAB_文字のみ](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF.png?width=400&height=110&name=INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF.png) [![お問い合わせ](https://hubspot-no-cache-na2-prod.s3.amazonaws.com/cta/default/5935783/34d009b3-5a7a-4831-94b3-6815d42142d9.png)](https://hubspot-cta-redirect-na2-prod.s3.amazonaws.com/cta/redirect/5935783/34d009b3-5a7a-4831-94b3-6815d42142d9) - [Vizlibナレッジ](https://knowledge.insight-lab.co.jp/vizlib) - [お役立ち資料](https://download.insight-lab.co.jp/vizlib/download) ###### 4 分で読むことができます。 # [Vizlib Gantt 機能説明＆ガントチャート作成手順説明（サンプルデータ付き）](https://knowledge.insight-lab.co.jp/vizlib/functions-of-vizlib-gantt) 執筆者 [Deck](https://knowledge.insight-lab.co.jp/vizlib/author/deck) 更新日時 2020年2月 ###### Topics: [Vizlib Gantt](https://knowledge.insight-lab.co.jp/vizlib/tag/vizlib-gantt) ![Vizlib Gantt](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_ColorGroup.png) 目次 **Vizlib Gantt**はQlik Sense拡張であるVizlibシリーズのうち、**ガントチャートの機能**に特化したエクステンションです。 ガントチャートを利用すると「プロジェクト管理」「生産管理」「スケジュール管理」などのタスクを把握しやすくなります。 この記事ではVizlib Ganttの機能説明とガントチャートの作成手順を説明します。   ## **ガントチャートの基本機能** Vizlib Ganttではタスクを大分類・中分類・小分類……と階層づけることができ、Qlik Senseのピボットテーブルのように階層を折りたたむことができます。 デフォルトではそれぞれの分類は同系色の色で表示され、カテゴリを視覚的に把握しやすくなっています。 大分類ごとに進捗率が計算されるため、それぞれのカテゴリの進捗を一目で確認することができます。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Gantt_ColorGroup.png?width=743&height=555&name=Gantt_ColorGroup.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_ColorGroup.png)   ## **ズーム機能対応** ガントチャートにはズーム機能がデフォルトで組み込まれており、 チャートにカーソルを合わせてマウスホイールを操作するとズームイン・ズームアウトが可能です。 一定以上のズームを行うと日付軸が月単位から週単位になるなど、より細かな単位でスケジュールを把握できます。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Gantt_Zoom_And_Dimension.png?width=1271&height=570&name=Gantt_Zoom_And_Dimension.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_Zoom_And_Dimension.png)   ## **カスタマイズ可能なツールチップ** マウス操作でいずれかの棒にカーソルを合わせるとツールチップが表示されます。 ツールチップの表示設定はHTMLを入力することができ、タグなど標準的なタグが利用可能であるため画像の表示やスタイルシート適用など高度なカスタマイズが可能です。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/HTML_Tooltip.png?width=361&height=361&name=HTML_Tooltip.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/HTML_Tooltip.png)   ## **チャート設定ウィザード内臓** また、Vizlib Ganttにはチャート設定支援機能が内蔵されています。 Qlik Senseの編集メニューからVizlib Ganttをシートに追加するとウィザードが表示され、 画面の指示に従って項目を入力するとガントチャートの表示に必要な設定を行うことができます。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Gantt_Wizard.png?width=583&height=558&name=Gantt_Wizard.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_Wizard.png) ガントチャートを作成する際に必要なデータモデルが満たしているべき項目などの情報は以下のリンクから確認できます（リンク先は英語）。 [https://community.vizlib.com/support/solutions/articles/35000145096-vizlib-gantt-data-model-requirements](https://community.vizlib.com/support/solutions/articles/35000145096-vizlib-gantt-data-model-requirements)   ## **ガントチャートを作成する** それでは、Vizlib Ganttを使用したガントチャートを作成してみます。 Vizlibエクステンションのダウンロード・インストール手順は [こちら](https://qliksense-i-ways.com/qliksense/extension/vizlib-library-for-qlik-sense-%e3%83%80%e3%82%a6%e3%83%b3%e3%83%ad%e3%83%bc%e3%83%89%ef%bc%86%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab%e6%89%8b%e9%a0%86%e8%a7%a3%e8%aa%ac/) の記事で解説しています。 インストール手順解説記事は「Vizlib library」をダウンロードしていますが、ダウンロードページの左側に「Vizlib Gantt」のダウンロードリンクがあります。 また、 [こちら](https://insightlab.backlog.jp/downloadAttachment/1095113601/Vizlib_Gantt_%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB%E3%83%87%E3%83%BC%E3%82%BF.csv) のリンクからガントチャートに表示するサンプルデータをダウンロードできます。   Qlik Senseで新規アプリを作成し、下の画面が表示されたらサンプルデータをドラッグ＆ドロップでロードさせます。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/New_app.png?width=649&height=427&name=New_app.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/New_app.png) データのロードが完了したらシート編集画面に入ります。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Open_Edit_Sheet.png?width=614&height=317&name=Open_Edit_Sheet.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Open_Edit_Sheet.png) 画面左側のメニューから「カスタム オブジェクト」を開き、「Vizlib Gantt」をシートに追加します。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Insert_Vizlib_Gantt.png?width=305&height=427&name=Insert_Vizlib_Gantt.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Insert_Vizlib_Gantt.png) ガントチャートの設定をするためのウィザードが表示されます。 ネットワーク経由でアップデートの有無が確認されるため少し時間がかかる場合があります。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Gantt_Wizard-1.png?width=583&height=558&name=Gantt_Wizard-1.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Gantt_Wizard-1.png) 「Event」「Start Date」「End Date」を順に入力します。 サンプルデータにはそれぞれ同名の項目が含まれています。 設定項目を入力すると「Create your Vizlib Gantt!」ボタンがクリックできるようになります。紫色のボタンをクリックして設定を完了します。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Inputed.png?width=567&height=279&name=Inputed.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Inputed.png) ガントチャートが作成されました。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Initial_Chart.png?width=1130&height=393&name=Initial_Chart.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Initial_Chart.png) チャートが表示されましたが、まだいくつか修正するべき箇所があります。 ・年月日が正しく認識させる ・タスクグループを追加する ・タスクの進捗を％表示する それぞれの修正を進めていきましょう。 軸の設定から「Start date」「End Date」を探し、欄の中を次のように修正します。Qlik Senseはスペースのある項目名はスミカッコで囲わなければ認識しないためです。 - Start Date → \[Start Date\] - End Date → \[End Date\] [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Dates.png?width=237&height=582&name=Dates.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Dates.png) チャート上部の日付表示が変わり、カレンダーが正しく認識されました。年月の下に表示されている数値は週番号になります。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Recognition_Dates.png?width=878&height=236&name=Recognition_Dates.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Recognition_Dates.png) 「軸」の設定項目にある「Event Bar」に進捗度を表す項目の「Progress」を入力します。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Event_Bar.png?width=234&height=169&name=Event_Bar.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Event_Bar.png) それぞれのイベントに進捗度が表示されるようになりました。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Progressed.png?width=876&height=195&name=Progressed.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Progressed.png) 軸に項目「Plan Type」「Phase」を追加します。それぞれの軸の設定はデフォルトのままとします。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/Added_Dimensions.png?width=252&height=202&name=Added_Dimensions.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/Added_Dimensions.png) タスクがグループ化されて表示されるようになりました。 [![](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/Imported_Blog_Media/completed.png?width=1255&height=647&name=completed.png)](https://knowledge.insight-lab.co.jp/hubfs/Imported_Blog_Media/completed.png) 以上でVizlib Ganttを利用したチャート作成方法の解説を終わります。   ## **まとめ** 以前まではQlik Senseが苦手としていたガントチャートの表現がVizlib Ganttによって高水準なチャートとして利用できるようになりました。 これにより、プロジェクト管理などの分野にもQlik Senseが活躍できる幅が広がったといえます。 Vizlibを体験してみませんか？ INSIGHT LABではVizlib紹介セミナーをオンデマンド配信しています。Vizlibの製品概要から、導入方法、美しいインターフェースをご紹介します。Qlik Senseユーザーの皆様、Qlik Senseの導入をご検討いただいている方も最先端の「データビジュアライゼーション」を是非ご体験ください。 [![詳細はこちら](https://hubspot-no-cache-na2-prod.s3.amazonaws.com/cta/default/5935783/846128e8-ac79-4331-ae76-2d7a778e1503.png)](https://hubspot-cta-redirect-na2-prod.s3.amazonaws.com/cta/redirect/5935783/846128e8-ac79-4331-ae76-2d7a778e1503) - [Tweet](https://twitter.com/share) ![Deck](https://knowledge.insight-lab.co.jp/hubfs/deck.png) #### 執筆者 [Deck](https://knowledge.insight-lab.co.jp/vizlib/author/deck) BIスペシャリスト ###### [前の投稿](https://knowledge.insight-lab.co.jp/vizlib/partner-ship) [![](https://knowledge.insight-lab.co.jp/hubfs/INSIGHT%20LAB_%E6%A8%AA-1.png)](https://knowledge.insight-lab.co.jp/vizlib/partner-ship) ###### [Qlik Sense のダッシュボード拡張機能を提供するVizlibと販売パートナー契約を締結](https://knowledge.insight-lab.co.jp/vizlib/partner-ship) ###### [次の投稿](https://knowledge.insight-lab.co.jp/vizlib/qlik-vizlibintegrates-smoothly) [![](https://knowledge.insight-lab.co.jp/hubfs/Vizlib_Qlik_650px_Dark.png)](https://knowledge.insight-lab.co.jp/vizlib/qlik-vizlibintegrates-smoothly) ###### [Qlik + Vizlib クラウドへのスムーズな統合が可能に！](https://knowledge.insight-lab.co.jp/vizlib/qlik-vizlibintegrates-smoothly) RECOMMEND こちらの記事も人気です。 ###### 5 分で読むことができます。 #### [Vizlib Library for Qlik Sense で作成できる美しくわかりやすいチャート21個](https://knowledge.insight-lab.co.jp/vizlib/vizlib-library-for-qlik-sense) ###### 2019年 12月 11日 ###### 4 分で読むことができます。 #### [Vizlib Gantt 機能説明＆ガントチャート作成手順説明（サンプルデータ付き）](https://knowledge.insight-lab.co.jp/vizlib/functions-of-vizlib-gantt) ###### 2020年 2月 28日 ###### 3 分で読むことができます。 #### [【Vizlib Server】OpenSSLでSSL証明書をアップデート](https://knowledge.insight-lab.co.jp/vizlib/openssl_certificate_update) ###### 2024年 6月 3日 ##### INFORMATION INFORMATION - [会社概要](https://www.insight-lab.co.jp/about/company.html) - [お問い合わせ](https://contact.insight-lab.co.jp/main) ##### MENU MENU - VIZLIBとは - [VIZLIBナレッジ](https://knowledge.insight-lab.co.jp/vizlib) - [VIZLIB価格表](https://download.insight-lab.co.jp/bi/wp/vizlib-price-list) - [お役立ち資料](https://download.insight-lab.co.jp/vizlib/download) [![INSIGHT LAB](https://knowledge.insight-lab.co.jp/hs-fs/hubfs/INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF_WHT-1.png?width=200&height=55&name=INSIGHT%20LAB_%E6%96%87%E5%AD%97%E3%81%AE%E3%81%BF_WHT-1.png "INSIGHT LAB")](https://www.insight-lab.co.jp/) - [プライバシーポリシー](https://www.insight-lab.co.jp/privacy.html) Copyright © 2020 INSIGHT LAB, Inc.