サイト名

【GAS入門】Googleスライドとスプレッドシートを連携する方法

Google スライドとスプレッド シートを連携できると、作業がずっと楽になるんだろうけど、どうやって始めればいいのか…分からないよ。
猫男
猫男
catman
catman
オッケー、catmanに任せな！

GASでGoogle スライドとスプレッド シートを連携する方法

Google Apps Script（GAS）でGoogle スライドとスプレッド シートを連携しよう。

さまざまな自動化をおこなえるぞ。

準備

まずはGoogle スライドとスプレッド シートのテンプレートを用意。それぞれのIDを取得しよう。

IDはスライドとスプレッドシートのURLに書いてあるから確認さ。

  • スライドのURL例：https://docs.google.com/presentation/d/{スライドID}/edit
  • スプレッドシートのURL例：https://docs.google.com/spreadsheets/d/{スプレッドシートID}/edit
IDで特定のスプレッドシートとスライドを呼び出してGASで操作することになる

GASのスクリプトは今回はスプレッドシートのコンテナバインド型のものを作成してみよう。

初心者でもわかる！GASのスタンドアロンとコンテナバインドの違いと使い分け
GASのスタンドアロンとコンテナバインドの違い それはね、「スタンドアロン」と「コンテナバインド」という2つの
https://earthpg.school/gas-standalone-containerbind/

 

スプレッドシートの値をGoogleスライドに転記

オッケー、それじゃあ早速本題だ。

まずは、GASでスライドのテキストボックスを書き換えてみよう。

スプレッドシートのデータをスライドに反映するぞ。


function updateSlideText() {
    var presentationId = "スライドID";
    var slide = SlidesApp.openById(presentationId);
    var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
    var range = sheet.getRange("A1"); 
    var data = range.getValue();
    slide.getSlides()[0].getPageElements()[0].asShape().getText().setText(data); 
}
  • presentationId：対象となるGoogleスライドのIDを指定（スライドのURLに含まれている長い文字列）
  • SlidesApp.openById()：指定したスライドを開く。
  • SpreadsheetApp.getActiveSpreadsheet()：現在開いているスプレッドシートを取得。
  • sheet.getRange("A1").getValue()：シートのA1セルの値を読み取る。
  • slide.getSlides()[0].getPageElements()[0]：スライド1枚目の最初の要素（テキストボックスなど）を指定。
  • .asShape().getText().setText(data)：図形（テキストボックス）のテキストをA1セルの値で更新。

 

最初のスライドと最初の要素を選び、スプレッドシートのA1セルの値でテキストを更新しているぞ。

注意点が1つある。

それは、スライドにあらかじめ何かしらの要素（テキストボックスや図形）を挿入しておくことだ。

なぜなら「1枚目のスライドに存在する最初の要素」 を指定しているからさ。

 

たとえば、スプレッドシートのA1のセルに「りんご」と入っていたとしよう。

gas スプレッドシート スライド 連携

その場合、このスライドが、

gas スプレッドシート スライド 連携

 

こうなる。

 

 

スライドに表を追加しよう

スプレッドシート中のデータを表としてスライドに反映させたい場合もあるよな？

このスクリプトで、スライドに表を挿入できる。


function addTableToSlide() {
  var presentationId = "スライドID";
  var slide = SlidesApp.openById(presentationId).getSlides()[0];
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var range = sheet.getRange("A1:B2"); 
  var values = range.getValues();

  // 行数と列数を指定してテーブルを挿入
  var table = slide.insertTable(values.length, values[0].length);
 
  // 各セルにスプレッドシートの値を流し込む
  for (var i = 0; i < values.length; i++) {
    for (var j = 0; j < values[i].length; j++) {
      table.getCell(i, j).getText().setText(values[i][j].toString());
    }
  }
}
  • presentationId：対象となるGoogleスライドのIDを指定。
  • SlidesApp.openById()：指定したスライドを開く。
  • sheet.getRange("A1:B2").getValues()：シートのA1～B2セルを配列として取得。
  • slide.insertTable(rows, columns)：指定した行数×列数のテーブルを新規挿入。
  • table.getCell(i, j).getText().setText(...)：各セルにシートの値を反映。

このスクリプトはスプレッドシートから値を取得し、その値でスライドに表を挿入する。

 

たとえば、スプレッドシートがこんな感じだとしよう。

gas スプレッドシート スライド 連携

その場合、スクリプトを実行すると、こんな感じの表をスライドに挿入できるぜ。

gas スプレッドシート スライド 連携

 

わあ、スライドに自動でデータが入れられるなんて画期的だね！これで発表資料作成も楽になりそう。
猫男
猫男

まとめ：GASでGoogleスライドとスプレッドシートを連携する利点

  • スライドのテキストをスプレッドシートのデータで自動更新
  • スライドにテーブルを挿入して、データを視覚的に提示
  • 作業の効率を大幅に向上させ、ミスを減らすことができる
これで作業も効率的になるし、もっとスライドをカスタマイズできるね！
猫男
猫男
catman
catman
まさにその通りだ。自動化を駆使してさらに効率的にこなしていこう。

 

練習問題

以下のスクリプトを見て、スライドのテキストをスプレッドシートのデータで更新する際に、セル “B3” のデータを「スライドの2番目の要素」に挿入するには、どのようにスクリプトを変更すれば良いか考えてみよう。


function updateSlideText() {
    var presentationId = "スライドID";
    var slide = SlidesApp.openById(presentationId);
    var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
    // 以下を修正
    var range = sheet.getRange("A1"); 
    var data = range.getValue();
    slide.getSlides()[0].getPageElements()[0].asShape().getText().setText(data); 
}

 

 

解答と解説

スライドの2番目の要素にセル “B3” の値を反映させるためには、取得するセルの範囲とページ要素を変更する必要がある。


function updateSlideText() {
    var presentationId = "スライドID";
    var slide = SlidesApp.openById(presentationId);
    var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
    var range = sheet.getRange("B3"); // "B3"のデータを取得
    var data = range.getValue();
    slide.getSlides()[0].getPageElements()[1].asShape().getText().setText(data); // 2番目の要素
}

変更点は次の通り：

  • sheet.getRange(“B3”);: スプレッドシートのセル「B3」の値を取得
  • slide.getSlides()[0].getPageElements()[1]: スライドの2番目のテキスト要素を選択

関連記事