GASでグラフ・チャートを自動生成してSlackに送信する

「毎週の売上グラフを手動でスクショしてSlackに貼り付けている」「レポートのたびにExcelでグラフを作る作業が面倒」——そんな繰り返し作業、Google Apps Script(GAS)で完全自動化できます。この記事では、スプレッドシーのデータからグラフを自動生成し、Slack指定チャンネルに毎週自動送信する仕組みをゼロから構築する方法を解説します。

週次レポートや月次KPI共有など、定期的なグラフ報告業務を抱えているチームに最適です。一度セットアップすれば、あとは完全放置でグラフがSlackに届きます。

この記事でできること

  • GASでGoogleスプレッドシートのデータからグラフ(棒グラフ・折れ線グラフ)を自動生成する
  • 生成したグラフを画像(PNG)として書き出す
  • Slack Incoming Webhookを使ってグラフ画像をチャンネルに自動投稿する
  • 毎週月曜朝9時など、時間ベーストリガーで定期実行する

事前準備(10分)

以下を事前に用意してください。

  • Googleスプレッドシート:グラフの元データが入ったシート(週別売上、KPIなど)
  • Slack Incoming Webhook URL:Slack APIページで発行(後述)
  • Google Apps Script:スプレッドシートのメニュー「拡張機能 → Apps Script」から開く

Slack Webhook URLの発行手順:
① https://api.slack.com/apps にアクセスして「Create New App」
② 「From scratch」を選択してアプリ名とワークスペースを設定
③ 「Incoming Webhooks」を有効化 → 「Add New Webhook to Workspace」
④ 投稿先チャンネルを選択 → 生成され�Webhook URLをコピーして保存

STEP 1:スプレッドシートにデータとグラフを準備する

まず、自動生成の元となるデータとグラフをスプレッドシートに用意します。サンプルとして「週別売上データ」を使います。

スプレッドシートの「Sheet1」に以下のようなデータを入力してください:

A列(週)    B列(売上・万円)
第1週        120
第2週        145
第3週        132
第4週        158
第5週        170

次に、このデータを選択してスプレッドシートのメニューから「挿入 → グラフ」でグラフを作成します。グラフの種類は棒グラフや折れ線グラフがおすすめです。グラフを作成したら、グラフオブジェクトがシート丈に配置されます。

STEP 2:GASでグラフを画像として取得するコードを書く

Apps Scriptエディタを開ぎ(拡張機能 → Apps Script)、以下のコードを貼り付けます。

// GASでグラフを画像取得してSlackに送信する
function sendChartToSlack() {
  // ===== 設定項目 =====
  const WEBHOOK_URL = PropertiesService.getScriptProperties().getProperty('SLACK_WEBHOOK_URL');
  const SHEET_NAME = 'Sheet1'; // グラフがあるシート名
  const CHART_INDEX = 0;       // シート上の何番目のグラフか(0始まり)
  
  // ===== スプレッドシートからグラフを取得 =====
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getSheetByName(SHEET_NAME);
  const charts = sheet.getCharts();
  
  if (charts.length === 0) {
    console.log('グラフが見つかりません。スプレッドシートにグラフを作成してください。');
    return;
  }
  
  const chart = charts[CHART_INDEX];
  
  // ===== グラフをPNG画像として取得 =====
  const imageBlob = chart.getAs('image/png');
  imageBlob.setName('weekly_sales_chart.png');
  
  // ===== Google DriveにびとまずアップロードしてURLを取得 =====
  const folder = DriveApp.getRootFolder();
  const file = folder.createFile(imageBlob);
  file.setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.VIEW);
  const fileUrl = 'https://drive.google.com/uc?export=view&id=' + file.getId();
  
  // ===== 今週の日付を取得してメッセージを組み立てる =====
  const today = new Date();
  const dateStr = Utilities.formatDate(today, 'Asia/Tokyo', 'yyyy年MM月dd日');
  
  const payload = {
    text: '📊 *週次売上レポート(' + dateStr + '時点)*',
    attachments: [
      {
        title: '週別売上推移',
        image_url: fileUrl,
        color: '#36a64f'
      }
    ]
  };
  
  // ===== SlackのWebhookにPOSTする =====
  const options = {
    method: 'post',
    contentType: 'application/json',
    payload: JSON.stringify(payload)
  };
  
  UrlFetchApp.fetch(WEBHOOK_URL, options);
  console.log('Slackへの送信が完了しました: ' + fileUrl);
}

STEP 3:Webhook URLをスクリプトプロパティに安全に保存する

Webhook URLをコードに直書きするはセキュリティ上NGです。必ずスクリプトプロパティに保存してください。

設定手順:
① Apps Scriptエディタの左メニューから「プロジェクトの設定(歯車アイコン)」を開く
② 「スクリプト プロパティ」セクションで「プロパティを追加」をクリック
③ プロパティ名に SLACK_WEBHOOK_URL、値に取得し�Webhook URLを貼り付けて保存

これで PropertiesService.getScriptProperties().getProperty('SLACK_WEBHOOK_URL') で安全に呼び出せます。

STEP 4:動作確認

Apps Scriptエディタで sendChartToSlack 関数を選択して「実行」ボタンをクリックします。初回実行時は権限承認ダイアログが表示されるので「許可」を選んでください。

実行後、Slackの指定チャンネルにグラフ画像付内にメッセージが届けば成功です。

トラブルシュートチェックリスト

  • 「グラフが見つかりません」と表示される:シート名(SHEET_NAME)が正しか確認。スプレッドシートにグラフオブジェクトが存在するか確認
  • Slackにメッセージが届かない:SLACK_WEBHOOK_URLが正しく設定されているか確認。Webhook URLの末尾にスペースや改行が入っついないか確認
  • 画像がSlackに表示されない:DriveファイルのURL共有設定が「リンクを知っついる共㎯」になっついか確認。アタッチメントのimage_urlが正しいか確認
  • 権限エラーが出る:DriveAppやUrlFetchApp、SpreadsheetAppの権限を承認しているか確認

STEP 5:毎週自動実行するトリガーを設定する

手動実行だすしなき、毎週月曜日の朝9時など定期実行させましょう。

// トリガーを自動設定するセットアップ関数(一度だ�e実行する)
function setupWeeklyTrigger() {
  // 既存のトリガーを削除(重複防止)
  const triggers = ScriptApp.getProjectTriggers();
  triggers.forEach(trigger => {
    if (trigger.getHandlerFunction() === 'sendChartToSlack') {
      ScriptApp.deleteTrigger(trigger);
    }
  });
  
  // 毎週月曜日の午前9〜10時に実行するトリガーを設定
  ScriptApp.newTrigger('sendChartToSlack')
    .timeBased()
    .onWeekDay(ScriptApp.WeekDay.MONDAY)
    .atHour(9)
    .create();
    
  console.log('週次トリガーを設定しました(毎週月曜 9〜10時)');
}

setupWeeklyTrigger 関数を一度ださ実行すれば、毎週月曜朝にグラフが自動でSlackに届くようになります。

応用:さらに便利にする拡張アイデア

  • 複数グラフをまとめて送信:charts配列をループして複数グラフをまとめて1だのSlackメッセージに添付することができます
  • Google Driveに蓄積せず直接送信:Slack Files Upload APIを使うと、DriveにファイルをアップせずGASから直接画像をSlackにアップロードできます(より抲本櫙どe��装向す)
  • グラフをGASかり動的に生成する:EmbeddedChartBuilderを使えば、シート上に配置済みのグラフを使わず、毎回最新データでグラフを動的に生成することも可能です
  • チャンネル別に送り�&ける:売上グラフは #sales-report、KPIグラフは #management-report など、用途別に複数Webhook URLを使い分けることができます
  • スプレッドシートURLも丁緒に送る:Slackメッセージに元のスプレッドシートへのリンクを添付すると、詳細確認もスムーズになります

まとめ

GASを使えば、スプレッドシートのグラフを自動生成してSlackに送信する仕組みを30分以内に構築できます。週次レポートや月次KPI共有など、繰り返しの報告業務を完全自動化することで、作業時間の削減と報告漏れーロを実現できます。

  • GASのgetAs(‘image/png’)メソッドでグラフを画像として取得できる
  • Slack Incoming Webhookと組み合わせることでグラフ自動投稿が実現できる
  • Webhook URLはスクリプトプロパティで安全に管理する
  • 時間ベーストリガーで毎週・毎月の定期実行が可能
  • 応用次第で複数グラフの一括送信や動的グラフ生成にも発展できる

「どのグラフを自動化すればいいか分からない」「社内のSlack通知フローを設計したい」とう方は、お気軽にご相談ください。

お問い合わせはこちら

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA