[Google Charts] スプレッドシートのデータでガントチャート

投稿者: | 2021年1月31日

Google Charts にはガントチャート(Gantt)があり、プロジェクト管理などで利用可能です。

関連情報は Googleスプレッドシートで保持し、自動的にチャートに反映されるようにしておければ、管理上も手間が少なくなります。

今回はスプレッドシートにサンプルのプロジェクトデータを入力し、それをガントチャートに反映する方法についてです。

データ作成

ガントチャートには決まったデータフォーマットがあります。

開発者用のサイトに記載の情報に従って、データをスプレッドシート上にプロットしていきます。

使用したプロジェクト情報は以下。

作業名称リソース開始日終了日完了率前作業
Task Aresource a2020/11/252020/12/01100
Task Bresource b2020/12/102021/01/3180Task A
Task Cresource b2021/01/102021/01/2040Task B

実際に作成したスプレッドシートはこのようになります。実データにはIDを定義したり、期間をミリ秒表示したり、依存関係のある作業は名称でなくIDを書いたりと、幾つか決まりがあります。

ソースコード

チャートを描画するソースコードはこのようになります。

注意点

パッケージのバージョン

ロードするパッケージのバージョンは、”48″とする必要がありました。

“current”だと上手く動作しません。

スプレッドシートの公開設定

スプレッドシートはデフォルトで非公開になっていると思いますが、その状態だとコードからアクセスができません。

本来は認証を適切に設定する必要がありますが、今回は一般公開(参照のみ)してとりあえずアクセスできるようにしました。非推奨。

ヘッダの考慮

スプレッドシートの1行目はヘッダ情報ですので、その部分はデータとして除外する必要がありますので、コード上はアクセスURLにヘッダ情報を追加しています。

描画結果

上手く動作すれば、このようなガントチャートが描けます。