Google スプレッドシートと Google スライドでビッグデータを分析情報に変換

1. ビッグデータ分析からスライドプレゼンテーションまで

データサイエンティストがビッグデータ分析を行うためのツールは数多くありますが、最終的にはアナリストが経営陣に結果を説明する必要があります。データベースに収集した生の数値データは、印刷物として見せたとしてもほとんど役に立ちません。この中級の Google Apps Script Codelab では、2 つの Google デベロッパープラットフォーム（Google Workspace と Google Cloud コンソール）を使用して、最後の仕上げを自動化します。

Google Cloud のデベロッパーツールを使用すると、詳細なデータ分析を実行できます。結果をスプレッドシートに挿入して、データを含むスライドプレゼンテーションを作成できます。これにより、データを管理者に配信するのに適した方法が提供されます。この Codelab では、Cloud Console の BigQuery API（Apps Script の拡張サービス）と、Google スプレッドシートおよび Google スライド向けの組み込み Apps Script サービスについて説明します。

目的

この Codelab のサンプルアプリは、次のコードサンプルを参考に作成されました。

GitHub でオープンソース化されている Google Apps Script BigQuery サービスサンプルアプリ。
スプレッドシートのデータからスライドを生成するデベロッパー動画で紹介され、こちらのブログ投稿で公開されているサンプルアプリ。
Google Slides API コードラボで紹介されているサンプルアプリ。

Slides API Codelab のサンプルアプリも BigQuery と Slides を使用していますが、この Codelab のサンプルアプリとはいくつかの点で異なります。

Node.js アプリと Apps Script アプリの比較。
Apps Script サービスを使用するのに対し、REST API を使用します。
Google ドライブは使用するが Google スプレッドシートは使用しないユーザーもいれば、このアプリのようにスプレッドシートは使用するがドライブは使用しないユーザーもいます。

この Codelab では、複数のテクノロジーを 1 つのアプリに統合し、Google Cloud 全体の機能と API を実際のユースケースに似た方法で紹介します。その目的は、皆様が自社や顧客の困難な問題を解決するにあたり、想像力を働かせ、Cloud Console と Google Workspace の両方を活用することを検討するきっかけにすることにあります。

学習内容

複数の Google サービスで Google Apps Script を使用する方法
Google BigQuery を使用してビッグデータを分析する方法
Google スプレッドシートを作成してデータを挿入する方法
スプレッドシートでグラフを作成する方法
スプレッドシートのデータとグラフを Google スライドのプレゼンテーションに移行する方法

必要なもの

インターネットにアクセスできるウェブブラウザ
Google アカウント（Google Workspace アカウントの場合、管理者の承認が必要となる可能性があります）
Google スプレッドシートに関する基礎知識
スプレッドシートの A1 形式を読み取る機能
JavaScript の基本的なスキル
Apps Script 開発の知識があると役立ちますが、必須ではありません

2. アンケート

この Codelab/チュートリアルをどのように使用しますか？

情報収集のために読み、技術系の同僚に転送する

できる限り読み進め、できる限り多くの演習を試す

何があっても、Codelab 全体を完了する

Google Workspace デベロッパーツールと API のご利用経験について、いずれに該当されますか？

初心者

中級者

上級者

Apps Script のご利用経験についてお答えください。

初心者

中級者

上級者

Cloud Console のデベロッパーツールと API のご利用経験について、いずれに該当されますか？

初心者

中級者

上級者

3. 概要

この Codelab の概要を理解したところで、これから行う作業について説明します。

既存の Apps Script と BigQuery のサンプルを取得して動作させます。
このサンプルでは、BigQuery にクエリを送信して結果を取得する方法を学習します。
Google スプレッドシートを作成し、BigQuery の結果を挿入します。
コードを変更して、返されてシートに挿入されるデータを少し変更します。
Apps Script の Sheets サービスを使用して、BigQuery データのグラフを作成します。
Slides サービスを使用して Google スライドのプレゼンテーションを作成します。
デフォルトのタイトルスライドにタイトルとサブタイトルを追加します。
データテーブルを含むスライドを作成し、シートのデータセルをエクスポートします。
別のスライドを作成し、スプレッドシートのグラフを挿入します。

まず、Apps Script、BigQuery、スプレッドシート、スライドの概要について説明します。

Google Apps Script と BigQuery

Google Apps Script は、Google REST API よりも高レベルの機能を持った Google Workspace 開発プラットフォームです。サーバーレスな開発環境およびアプリケーションホスティング環境であり、多様なスキルレベルのデベロッパーが使用できます。Apps Script は、Google Workspace の自動化、拡張、統合を可能にするサーバーレスの JavaScript ランタイムです。

Apps Script は Node.js に類似したサーバーサイド JavaScript ですが、高速な非同期のイベント駆動型アプリケーションホスティングに比べ、Google Workspace やその他の Google サービスとの緊密な統合が重視されています。また、従来とは異なる開発環境を特徴としており、次のことが可能になります。

ブラウザベースのコードエディタを使用してスクリプトを開発できます。また、Apps Script 用のコマンドラインデプロイツールである clasp を使用すれば、ローカルでの開発も可能です。
Google Workspace やその他の Google サービスまたは外部サービスに（Apps Script の URL Fetch サービスや JDBC サービスを使用して）アクセスできるようカスタマイズされた特殊な JavaScript でコードを記述します。
Apps Script で自動的に処理されるため、認証コードを作成する必要がありません。
アプリは常にクラウドの Google サーバーで実行されるため、アプリのホスティングが不要です。

Apps Script は次の 2 つの方法で、他の Google テクノロジーと連携できます。

組み込みサービスとして
拡張サービスとして使用する

組み込みサービスには、ユーザーデータ、他の Google システム、外部システムとやり取りするための高レベルのメソッドがあります。拡張サービスは、基本的に Google Workspace API または Google REST API のシンラッパーです。拡張サービスでは REST API をフルに利用して、組み込みサービスよりも高度な機能を開発できますが、それだけコードが複雑になります（ただし REST API 自体よりも簡単に使用できます）。拡張サービスは、使用する前にスクリプトプロジェクトに対して有効にしておく必要もあります。

可能な場合は、組み込みサービスの使用をおすすめします。組み込みサービスは使いやすく、拡張サービスよりも多くの処理を行うことができます。ただし、組み込みサービスが用意されていない Google API の場合は、拡張サービスが唯一の方法になります。たとえば、Google BigQuery には組み込みサービスはありませんが、BigQuery サービスは存在します。BigQuery サービスは、Google BigQuery API を使用して大規模なデータコーパス（数テラバイトなど）に対してクエリを実行できる Cloud コンソールサービスです。結果は数秒で得られます。

Apps Script からスプレッドシートやスライドにアクセスする

BigQuery とは異なり、スプレッドシートとスライドには組み込みサービスがあります。また、API でしか使用できない機能にアクセスするための拡張サービスも用意されています。コードを使用する前に、組み込みのスプレッドシートサービスとスライドサービスの両方のドキュメントをご覧ください。スプレッドシートとスライドの両方の高度なサービスに関するドキュメントもあります。

4. タスク 1: BigQuery を実行して、結果をスプレッドシートにロギングする

はじめに

この最初のタスクで、この Codelab の大部分を行います。実際、このセクションを終了すれば、Codelab 全体の半分が終了したことになります。このセクションは複数のサブセクションに分かれており、次の内容について説明します。

Google Apps Script プロジェクトと Cloud コンソールプロジェクトの両方を作成します。
BigQuery 拡張サービスへのアクセスを有効にします。
スクリプトエディタを開き、アプリケーションのソースコードを入力します。
アプリ承認プロセス（OAuth2）を実行します。
BigQuery にリクエストを送信するアプリケーションを実行します。
BigQuery の結果を使用して作成された新しい Google スプレッドシートを確認します。

セットアップ

Apps Script プロジェクトを作成するには、script.google.com に移動し、[新しいプロジェクト] をクリックします。
Apps Script プロジェクトの名前を変更するには、[無題のプロジェクト] をクリックし、プロジェクトのタイトルを入力して、[名前を変更] をクリックします。

次に、BigQuery でデータをクエリするための Cloud コンソールプロジェクトを作成する必要があります。

Cloud Console プロジェクトを作成するには、このショートカットリンクを使用してプロジェクトを作成し、プロジェクトに名前を付けて [作成] をクリックします。

プロジェクトの作成が完了すると、ページに通知が表示されます。ページの上部にあるプロジェクトのリストで、新しいプロジェクトが選択されていることを確認します。
メニューアイコンをクリックし、[API とサービス] > [OAuth 同意画面]（直接リンク）に移動します。
[内部] > [作成] をクリックして、組織内の Google Workspace ユーザー向けのアプリをビルドします。
[アプリ名] フィールドに「Big Data Codelab」と入力します。
[ユーザーサポート] フィールドと [デベロッパーの連絡先情報] フィールドに連絡先メールアドレスを入力します。
[保存して次へ > 保存して次へ] をクリックします。
ナビゲーションバーの [その他] をクリックし、[プロジェクトの設定]（直接リンク）を選択します。
[プロジェクト番号] の下に表示されている値をコピーします。（別のプロジェクト ID フィールドは、この Codelab の後半で使用します）。

次に、Apps Script プロジェクトを Cloud Console プロジェクトに接続します。

App Script エディタに切り替えて、[プロジェクトの設定 ] をクリックします。
[Google Cloud Platform（GCP）プロジェクト] で、[プロジェクトを変更] をクリックします。
プロジェクト番号を入力し、[プロジェクトを設定] をクリックします。
次に、[エディタ ] をクリックして、BigQuery 拡張サービスの追加を開始します。
[サービス] の横にある [サービスを追加] をクリックします。
[サービスを追加] ダイアログで、[BigQuery API] を選択して [追加] をクリックします。

最後のステップは、Cloud Console で BigQuery API を有効にすることです。

これを行うには、Cloud Console に切り替えて、[API とサービス] > [ダッシュボード] をクリックします。（ステップ 3 で作成したプロジェクトにまだいることを確認してください）。
[API とサービスの有効化] をクリックします。
「big query」で検索して [BigQuery API] を選択し（BigQuery Data Transfer API は選択しない）、[有効にする] をクリックしてオンにします。

これで、アプリケーションコードを入力し、承認プロセスを経て、このアプリケーションの最初のイテレーションを実行できるようになりました。

アプリケーションをアップロードして実行する

スクリプトエディタで、デフォルトの myFunction() コードブロックを次のコードに置き換えます。

// File name for data results
var QUERY_NAME = "Most common words in all of Shakespeare's works";
// Replace this value with your Google Cloud Console Project ID
var PROJECT_ID = '';
if (!PROJECT_ID) throw Error('Project ID is required in setup');

/**
 * Runs a BigQuery query; puts results into a Sheet. You must turn on
 * the BigQuery advanced service before you can run this code.
 * @see https://developers.google.com/apps-script/advanced/bigquery#run_query
 * @see https://github.com/googleworkspace/apps-script-samples/blob/master/advanced/bigquery.gs
 *
 * @returns {Spreadsheet} Returns a spreadsheet with BigQuery results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/spreadsheet
 */
function runQuery() {
  // Replace sample with your own BigQuery query.
  var request = {
    query:
        'SELECT ' +
            'LOWER(word) AS word, ' +
            'SUM(word_count) AS count ' +
        'FROM [bigquery-public-data:samples.shakespeare] ' +
        'GROUP BY word ' +
        'ORDER BY count ' +
        'DESC LIMIT 10'
  };
  var queryResults = BigQuery.Jobs.query(request, PROJECT_ID);
  var jobId = queryResults.jobReference.jobId;

  // Wait for BigQuery job completion (with exponential backoff).
  var sleepTimeMs = 500;
  while (!queryResults.jobComplete) {
    Utilities.sleep(sleepTimeMs);
    sleepTimeMs *= 2;
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId);
  }

  // Get all results from BigQuery.
  var rows = queryResults.rows;
  while (queryResults.pageToken) {
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId, {
      pageToken: queryResults.pageToken
    });
    rows = rows.concat(queryResults.rows);
  }

  // Return null if no data returned.
  if (!rows) {
    return Logger.log('No rows returned.');
  }

  // Create the results spreadsheet.
  var spreadsheet = SpreadsheetApp.create(QUERY_NAME);
  var sheet = spreadsheet.getActiveSheet();

  // Add headers to Sheet.
  var headers = queryResults.schema.fields.map(function(field) {
    return field.name.toUpperCase();
  });
  sheet.appendRow(headers);

  // Append the results.
  var data = new Array(rows.length);
  for (var i = 0; i < rows.length; i++) {
    var cols = rows[i].f;
    data[i] = new Array(cols.length);
    for (var j = 0; j < cols.length; j++) {
      data[i][j] = cols[j].v;
    }
  }

  // Start storing data in row 2, col 1
  var START_ROW = 2;      // skip header row
  var START_COL = 1;
  sheet.getRange(START_ROW, START_COL, rows.length, headers.length).setValues(data);

  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl());
}

[保存] をクリックします。
Code.gs の横にあるその他アイコン > [名前を変更] をクリックします。タイトルを Code.gs から bq-sheets-slides.js に変更します。
次に、BigQuery に対してクエリを実行し、結果を Google スプレッドシートに書き込むコードを確認します。runQuery() の上部付近に表示されます。

SELECT
    LOWER(word) AS word,
    SUM(word_count) AS count
FROM [bigquery-public-data:samples.shakespeare]
GROUP BY word
ORDER BY count
DESC LIMIT 10

このクエリは BigQuery の一般公開データセット内にあるシェークスピアの作品を検索し、全作品中で頻繁に出現する上位 10 個の単語を頻出度の降順で並べ替えて表示します。このコンパイルを手作業で行うことを考えると、BigQuery の有用性がよくわかります。

この関数は、有効な Cloud Console プロジェクト ID を必要とする PROJECT_ID 変数も宣言します。変数の下の if ステートメントは、プロジェクト ID が指定されていない場合にアプリケーションがこれ以上実行されないようにするためのものです。

Cloud コンソールプロジェクトに切り替え、ナビゲーションバーのその他アイコンをクリックして、[プロジェクトの設定] を選択します。
[プロジェクト ID] に表示されている値をコピーします。
App Script エディタに戻り、bq-sheets-slides.js で PROJECT_ID 変数を見つけて、値を追加します。
[保存] > [実行] をクリックします。
[権限を確認] をクリックして続行します。

注: gmail.com アカウントを使用している場合、スクリプトを初めて使用するときに「このアプリは確認されていません」というダイアログが表示されることがあります。Google は、この情報を使用して、不明な作成者や信頼できない作成者のコードを使用している可能性のあるユーザーに警告します。このダイアログが表示された場合は、スクリプトの作成者であるため、続行して構いません。画面の指示に沿って、スクリプトの承認を続行します。

未確認のアプリのダイアログで、[詳細] をクリックします。
[your-project-name（安全でない）に移動] をクリックします。
[許可] をクリックします。

この Codelab では、権限に関するプロンプトがいくつか表示されることがあります。このプロセスの詳細については、Google サービスの承認をご覧ください。

スクリプトの実行が開始されると、組み込みの実行ログが開き、スクリプトアクションがリアルタイムで記録されます。

実行ログに「実行完了」と表示されたら、Google ドライブ（drive.google.com）に移動し、「Most common words in all of Shakespeare's works」（または QUERY_NAME 変数を更新した場合は、その変数に割り当てた名前）という名前の Google スプレッドシートを見つけます。
スプレッドシートを開くと、10 個の最も一般的な単語とそれらの合計出現数が降順で並べ替えられて表示されます。

タスク 1 の概要

復習すると、シェイクスピアの全作品に対してクエリを実行し、全戯曲の全単語を調べるコードを実行しました。単語をカウントし、出現頻度の降順で並べ替えました。また、Google スプレッドシート用の Apps Script 組み込みサービスを使用して、このデータを表示しました。

bq-sheets-slides.js で使用したコードは、この Codelab の GitHub リポジトリ（github.com/googlecodelabs/bigquery-sheets-slides）の step1 フォルダにもあります。このコードは、シェークスピアが使用した 10 文字以上の単語のうち、最も頻繁に使用された単語を取得するクエリを実行する、BigQuery の高度なサービスページの元の例に触発されたものです。GitHub リポジトリにも例があります。

シェークスピアの作品やその他の一般公開データテーブルを使用して作成できる他のクエリに関心がある場合は、BigQuery サンプルテーブルのクエリ方法とこの GitHub リポジトリをご覧ください。

Apps Script でクエリを実行する前に、Cloud Console の BigQuery ページを使用してクエリを実行することもできます。このページを開くには、メニューアイコンをクリックして、[BigQuery UI] > [SQL ワークスペース]（直接リンク）に移動します。たとえば、BigQuery のグラフィカルインターフェースでは、クエリは次のように表示されます。

BigQueryUI

5. タスク 2: Google スプレッドシートでグラフを作成する

runQuery() の目的は、BigQuery を使用して、そのデータ結果を Google スプレッドシートに送信することです。次に、データを使用してグラフを作成する必要があります。Sheets の newChart() メソッドを呼び出す createColumnChart() という新しい関数を作成しましょう。

Apps Script エディタで、runQuery() の後に bq-sheets-slides.js に createColumnChart() 関数を追加します。このコードはスプレッドシートを取得し、すべてのデータが反映された棒グラフをリクエストします。最初の行は列ヘッダーであるため、データ範囲はセル A2 から開始します。

/**
 * Uses spreadsheet data to create a column chart.
 * @param {Spreadsheet} Spreadsheet containing results data
 * @returns {EmbeddedChart} Visualizes the results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/embedded-chart
 */
function createColumnChart(spreadsheet) {
  // Retrieve the populated (first) Sheet.
  var sheet = spreadsheet.getSheets()[0];
  // Data range in Sheet is from cell A2 to B11.
  var START_CELL = 'A2';  // skip header row
  var END_CELL = 'B11';
  // Place chart on Sheet starting on cell E5.
  var START_ROW = 5;      // row 5
  var START_COL = 5;      // col E
  var OFFSET = 0;

  // Create & place chart on the Sheet using above values.
  var chart = sheet.newChart()
     .setChartType(Charts.ChartType.COLUMN)
     .addRange(sheet.getRange(START_CELL + ':' + END_CELL))
     .setPosition(START_ROW, START_COL, OFFSET, OFFSET)
     .build();
  sheet.insertChart(chart);
}

createColumnChart() 関数にはスプレッドシートオブジェクトパラメータが必要なので、createColumnChart() に渡すことができる spreadsheet オブジェクトを返すように runQuery() を更新する必要があります。runQuery() の最後に、シートが作成されたことをロギングしてから、spreadsheet オブジェクトを返します。

  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl());

  // NEW: Return the spreadsheet object for later use.
  return spreadsheet;
}

runQuery() と createColumnChart() の両方を呼び出す createBigQueryPresentation() 関数を作成します。BigQuery とグラフ作成機能を論理的に分離することはベストプラクティスです。

/**
 * Runs the query, adds data and a chart to a spreadsheet.
 */
function createBigQueryPresentation() {
  var spreadsheet = runQuery();
  createColumnChart(spreadsheet);
}

スプレッドシートオブジェクトを返し、エントリ関数を作成するという、2 つの重要な手順を踏みました。runQuery() を使いやすくするには、ログ行を runQuery() から createBigQueryPresentation() に移動する必要があります。メソッドは次のようになります。

/**
 * Runs a BigQuery query, adds data and a chart to a spreadsheet.
 */
function createBigQueryPresentation() {
  var spreadsheet = runQuery();
  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl()); // MOVED HERE
  createColumnChart(spreadsheet);
}

上記の変更（PROJECT_ID を除く）を行うと、bq-sheets-slides.js は次のようになります。このコードは GitHub リポジトリの step2 にもあります。

// File name for data results
var QUERY_NAME = "Most common words in all of Shakespeare's works";
// Replace this value with your Google Cloud Console Project ID
var PROJECT_ID = '';
if (!PROJECT_ID) throw Error('Project ID is required in setup');

/**
 * Runs a BigQuery query; puts results into a sheet. You must turn on
 * the BigQuery advanced service before you can run this code.
 * @see https://developers.google.com/apps-script/advanced/bigquery#run_query
 * @see https://github.com/googleworkspace/apps-script-samples/blob/master/advanced/bigquery.gs
 *
 * @returns {Spreadsheet} Returns a spreadsheet with BigQuery results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/spreadsheet
 */
function runQuery() {
  // Replace sample with your own BigQuery query.
  var request = {
    query:
        'SELECT ' +
            'LOWER(word) AS word, ' +
            'SUM(word_count) AS count ' +
        'FROM [bigquery-public-data:samples.shakespeare] ' +
        'GROUP BY word ' +
        'ORDER BY count ' +
        'DESC LIMIT 10'
  };
  var queryResults = BigQuery.Jobs.query(request, PROJECT_ID);
  var jobId = queryResults.jobReference.jobId;

  // Wait for BigQuery job completion (with exponential backoff).
  var sleepTimeMs = 500;
  while (!queryResults.jobComplete) {
    Utilities.sleep(sleepTimeMs);
    sleepTimeMs *= 2;
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId);
  }

  // Get all results from BigQuery.
  var rows = queryResults.rows;
  while (queryResults.pageToken) {
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId, {
      pageToken: queryResults.pageToken
    });
    rows = rows.concat(queryResults.rows);
  }

  // Return null if no data returned.
  if (!rows) {
    return Logger.log('No rows returned.');
  }

  // Create the results spreadsheet.
  var spreadsheet = SpreadsheetApp.create(QUERY_NAME);
  var sheet = spreadsheet.getActiveSheet();

  // Add headers to sheet.
  var headers = queryResults.schema.fields.map(function(field) {
    return field.name.toUpperCase();
  });
  sheet.appendRow(headers);

  // Append the results.
  var data = new Array(rows.length);
  for (var i = 0; i < rows.length; i++) {
    var cols = rows[i].f;
    data[i] = new Array(cols.length);
    for (var j = 0; j < cols.length; j++) {
      data[i][j] = cols[j].v;
    }
  }

  // Start storing data in row 2, col 1
  var START_ROW = 2;      // skip header row
  var START_COL = 1;
  sheet.getRange(START_ROW, START_COL, rows.length, headers.length).setValues(data);

  // Return the spreadsheet object for later use.
  return spreadsheet;
}

/**
 * Uses spreadsheet data to create a columnar chart.
 * @param {Spreadsheet} Spreadsheet containing results data
 * @returns {EmbeddedChart} Visualizes the results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/embedded-chart
 */
function createColumnChart(spreadsheet) {
  // Retrieve the populated (first) sheet.
  var sheet = spreadsheet.getSheets()[0];
  // Data range in sheet is from cell A2 to B11.
  var START_CELL = 'A2';  // skip header row
  var END_CELL = 'B11';
  // Place chart on Sheet starting on cell E5.
  var START_ROW = 5;      // row 5
  var START_COL = 5;      // col E
  var OFFSET = 0;

  // Create & place chart on the sheet using above values.
  var chart = sheet.newChart()
     .setChartType(Charts.ChartType.COLUMN)
     .addRange(sheet.getRange(START_CELL + ':' + END_CELL))
     .setPosition(START_ROW, START_COL, OFFSET, OFFSET)
     .build();
  sheet.insertChart(chart);
}

/**
 * Runs a BigQuery query, adds data and a chart to a spreadsheet.
 */
function createBigQueryPresentation() {
  var spreadsheet = runQuery();
  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl());
  createColumnChart(spreadsheet);
}

スクリプトエディタで、スクリプトプロジェクトを保存します。関数リストから createBigQueryPresentation を選択し、[実行] をクリックします。完了すると、Google ドライブに別のスプレッドシートが作成されますが、今度はスプレッドシート内のデータの横にグラフが表示されます。

グラフ付きシート

6. タスク 3: 結果データをスライドに挿入する

この Codelab の最後として、ここでは Google スライドプレゼンテーションを作成します。タイトルスライドにはタイトルとサブタイトルを入力します。データセルとグラフのスライドを作成します。

Apps Script エディタで、createColumnChart() の後に bq-sheets-slides.js に createSlidePresentation() 関数を追加します。スライドデッキのすべての処理はこの関数で行われます。まず、スライドを作成し、タイトルとサブタイトルを入力します。このタイトルスライドは、プレゼンテーションを新規作成する際のデフォルトとなります。

/**
 * Create presentation with spreadsheet data and a chart
 * @param {Spreadsheet} Spreadsheet containing results data
 * @param {EmbeddedChart} Sheets chart to embed on a slide
 * @returns {Presentation} Slide deck with the results
  * @see https://developers.google.com/apps-script/reference/slides/presentation
 */
function createSlidePresentation(spreadsheet, chart) {
  // Create the presentation.
  var deck = SlidesApp.create(QUERY_NAME);

  // Populate the title slide.
  var [title, subtitle] = deck.getSlides()[0].getPageElements();
  title.asShape().getText().setText(QUERY_NAME);
  subtitle.asShape().getText().setText('using Google Cloud Console and Google Workspace APIs:\n' +
    'Google Apps Script, BigQuery, Sheets, Slides');

createSlidePresentation() の次のステップでは、Google スプレッドシートから新しいスライドにセルデータをインポートします。このコードスニペットを関数に追加します。

  // Data range to copy is from cell A1 to B11
  var START_CELL = 'A1';  // include header row
  var END_CELL = 'B11';
  // Add the table slide and insert an empty table on it with
  // the dimensions of the data range; fails if the sheet is empty.
  var tableSlide = deck.appendSlide(SlidesApp.PredefinedLayout.BLANK);
  var sheetValues = spreadsheet.getSheets()[0].getRange(
      START_CELL + ':' + END_CELL).getValues();
  var table = tableSlide.insertTable(sheetValues.length, sheetValues[0].length);

  // Populate the table with spreadsheet data.
  for (var i = 0; i < sheetValues.length; i++) {
    for (var j = 0; j < sheetValues[0].length; j++) {
      table.getCell(i, j).getText().setText(String(sheetValues[i][j]));
    }
  }

createSlidePresentation() の最後のステップでは、もう 1 つスライドを作成して、スプレッドシートからグラフをインポートし、Presentation オブジェクトを返します。このコードスニペットを関数に追加します。

  // Add a chart slide and insert the chart on it.
  var chartSlide = deck.appendSlide(SlidesApp.PredefinedLayout.BLANK);
  chartSlide.insertSheetsChart(chart);

  // Return the presentation object for later use.
  return deck;
}

関数が完成したところで、振り返ってみましょう。createSlidePresentation() には、スプレッドシートオブジェクトパラメータとグラフオブジェクトパラメータの両方が必要です。すでに Spreadsheet オブジェクトを返すように runQuery() を調整しましたが、今度は createColumnChart() に同様の変更を加えて、グラフオブジェクト（EmbeddedChart）を返すようにします。createColumnChart() に戻り、次のコードスニペットを関数の末尾に追加します。

  // NEW: Return the chart object for later use.
  return chart;
}

createColumnChart() がグラフオブジェクトを返すようになったため、グラフを変数に保存する必要があります。次に、スプレッドシートとグラフの両方の変数を createSlidePresentation() に渡します。新規に作成されたスプレッドシートの URL をロギングするのと同様に、新しいスライドプレゼンテーションの URL もロギングしましょう。createBigQueryPresentation() を次のように更新します。

/**
 * Runs a BigQuery query, adds data and a chart to a spreadsheet,
 * and adds the data and chart to a new slide presentation.
 */
function createBigQueryPresentation() {
  var spreadsheet = runQuery();
  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl());
  var chart = createColumnChart(spreadsheet); // UPDATED
  var deck = createSlidePresentation(spreadsheet, chart); // NEW
  Logger.log('Results slide deck created: %s', deck.getUrl()); // NEW
}

保存して、createBigQueryPresentation() を再度実行します。ただし、実行する前に、Google スライドプレゼンテーションの表示と管理に必要な権限をユーザーから取得する必要があります。これらの権限を確認して許可すると、以前と同じように実行されます。
作成したスプレッドシートに加えて、次の 3 枚のスライド（タイトル、データテーブル、データグラフ）を含む新しいスライドプレゼンテーションが追加されていることを確認します。

7. まとめ

おめでとうございます。Google Cloud の両方の側面を使用するアプリケーションを作成しました。このワークフローは、一般公開データセットの 1 つに対してクエリを実行する Google BigQuery リクエストを実行し、結果を保存する Google スプレッドシートを作成し、データに基づいてグラフを追加し、最後にスプレッドシートのデータとグラフの結果を特徴とする Google スライドプレゼンテーションを作成します。

技術的な側面からみれば、上述のとおりですが、大まかにいえば、ビッグデータ分析から関係者に提示できる結果の作成までを、コードを使って自動的に行ったことになります。このサンプルが、独自のプロジェクトに合わせてカスタマイズするきっかけになれば幸いです。この Codelab の最後に、このサンプルアプリをさらに強化する方法についていくつか提案します。

最後のタスクの変更（PROJECT_ID を除く）を行うと、bq-sheets-slides.js は次のようになります。

/**
 * Copyright 2018 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at apache.org/licenses/LICENSE-2.0.
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

// File name for data results
var QUERY_NAME = "Most common words in all of Shakespeare's works";
// Replace this value with your Google Cloud Console Project ID
var PROJECT_ID = '';
if (!PROJECT_ID) throw Error('Project ID is required in setup');

/**
 * Runs a BigQuery query; puts results into a spreadsheet. You must turn on
 * the BigQuery advanced service before you can run this code.
 * @see https://developers.google.com/apps-script/advanced/bigquery#run_query
 * @see https://github.com/googleworkspace/apps-script-samples/blob/master/advanced/bigquery.gs
 *
 * @returns {Spreadsheet} Returns a spreadsheet with BigQuery results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/spreadsheet
 */
function runQuery() {
  // Replace sample with your own BigQuery query.
  var request = {
    query:
        'SELECT ' +
            'LOWER(word) AS word, ' +
            'SUM(word_count) AS count ' +
        'FROM [bigquery-public-data:samples.shakespeare] ' +
        'GROUP BY word ' +
        'ORDER BY count ' +
        'DESC LIMIT 10'
  };
  var queryResults = BigQuery.Jobs.query(request, PROJECT_ID);
  var jobId = queryResults.jobReference.jobId;

  // Wait for BigQuery job completion (with exponential backoff).
  var sleepTimeMs = 500;
  while (!queryResults.jobComplete) {
    Utilities.sleep(sleepTimeMs);
    sleepTimeMs *= 2;
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId);
  }

  // Get all results from BigQuery.
  var rows = queryResults.rows;
  while (queryResults.pageToken) {
    queryResults = BigQuery.Jobs.getQueryResults(PROJECT_ID, jobId, {
      pageToken: queryResults.pageToken
    });
    rows = rows.concat(queryResults.rows);
  }

  // Return null if no data returned.
  if (!rows) {
    return Logger.log('No rows returned.');
  }

  // Create the results spreadsheet.
  var spreadsheet = SpreadsheetApp.create(QUERY_NAME);
  var sheet = spreadsheet.getActiveSheet();

  // Add headers to sheet.
  var headers = queryResults.schema.fields.map(function(field) {
    return field.name.toUpperCase();
  });
  sheet.appendRow(headers);

  // Append the results.
  var data = new Array(rows.length);
  for (var i = 0; i < rows.length; i++) {
    var cols = rows[i].f;
    data[i] = new Array(cols.length);
    for (var j = 0; j < cols.length; j++) {
      data[i][j] = cols[j].v;
    }
  }

  // Start storing data in row 2, col 1
  var START_ROW = 2;      // skip header row
  var START_COL = 1;
  sheet.getRange(START_ROW, START_COL, rows.length, headers.length).setValues(data);

  // Return the spreadsheet object for later use.
  return spreadsheet;
}

/**
 * Uses spreadsheet data to create a column chart.
 * @param {Spreadsheet} Spreadsheet containing results data
 * @returns {EmbeddedChart} Visualizes the results
 * @see https://developers.google.com/apps-script/reference/spreadsheet/embedded-chart
 */
function createColumnChart(spreadsheet) {
  // Retrieve the populated (first) sheet.
  var sheet = spreadsheet.getSheets()[0];
  // Data range in sheet is from cell A2 to B11.
  var START_CELL = 'A2';  // skip header row
  var END_CELL = 'B11';
  // Place chart on sheet starting on cell E5.
  var START_ROW = 5;      // row 5
  var START_COL = 5;      // col E
  var OFFSET = 0;

  // Create & place chart on the sheet using above values.
  var chart = sheet.newChart()
     .setChartType(Charts.ChartType.COLUMN)
     .addRange(sheet.getRange(START_CELL + ':' + END_CELL))
     .setPosition(START_ROW, START_COL, OFFSET, OFFSET)
     .build();
  sheet.insertChart(chart);
  
  // Return the chart object for later use.
  return chart;
}

/**
 * Create presentation with spreadsheet data and a chart
 * @param {Spreadsheet} Spreadsheet containing results data
 * @param {EmbeddedChart} Sheets chart to embed on a slide
 * @returns {Presentation} Slide deck with the results
 * @see https://developers.google.com/apps-script/reference/slides/presentation
 */
function createSlidePresentation(spreadsheet, chart) {
  // Create the presentation.
  var deck = SlidesApp.create(QUERY_NAME);

  // Populate the title slide.
  var [title, subtitle] = deck.getSlides()[0].getPageElements();
  title.asShape().getText().setText(QUERY_NAME);
  subtitle.asShape().getText().setText('using Google Cloud Console and Google Workspace APIs:\n' +
    'Google Apps Script, BigQuery, Sheets, Slides');

  // Data range to copy is from cell A1 to B11
  var START_CELL = 'A1';  // include header row
  var END_CELL = 'B11';
  // Add the table slide and insert an empty table on it with
  // the dimensions of the data range; fails if the sheet is empty.
  var tableSlide = deck.appendSlide(SlidesApp.PredefinedLayout.BLANK);
  var sheetValues = spreadsheet.getSheets()[0].getRange(
      START_CELL + ':' + END_CELL).getValues();
  var table = tableSlide.insertTable(sheetValues.length, sheetValues[0].length);

  // Populate the table with spreadsheet data.
  for (var i = 0; i < sheetValues.length; i++) {
    for (var j = 0; j < sheetValues[0].length; j++) {
      table.getCell(i, j).getText().setText(String(sheetValues[i][j]));
    }
  }

  // Add a chart slide and insert the chart on it.
  var chartSlide = deck.appendSlide(SlidesApp.PredefinedLayout.BLANK);
  chartSlide.insertSheetsChart(chart);

  // Return the presentation object for later use.
  return deck;
}

/**
 * Runs a BigQuery query, adds data and a chart to a spreadsheet,
 * and adds the data and chart to a new slide presentation.
 */
function createBigQueryPresentation() {
  var spreadsheet = runQuery();
  Logger.log('Results spreadsheet created: %s', spreadsheet.getUrl());
  var chart = createColumnChart(spreadsheet);
  var deck = createSlidePresentation(spreadsheet, chart);
  Logger.log('Results slide deck created: %s', deck.getUrl());
}

このコードサンプルは、GitHub リポジトリの final フォルダにもあります。

8. 参考情報

以下に、この Codelab で取り上げた題材を掘り下げたり、Google デベロッパーツールにプログラムでアクセスする他の方法を探索したりするために役立つ追加資料を示します。

このアプリケーションのリソース

ドキュメント

動画

ニュースと最新情報

Google Cloud Platform ブログ
Google Cloud データ分析ブログ
Google Developers ブログ
Twitter: Google Developers（@googledevs）
Google Workspace デベロッパーブログ
Twitter: Google Workspace Developers（@workspacedevs）

その他の Codelab

入門

[Google スプレッドシート] Google スプレッドシートでの Apps Script の基礎
[REST API] Google Workspace と Google API を使用して Google ドライブのファイルやフォルダにアクセスする

中級

[Apps Script] CLASP Apps Script コマンドラインツール
[Apps Script] Gmail 用 Google Workspace アドオン
[Apps Script] Hangouts Chat 用のカスタムボット
[REST API] Google スプレッドシートをアプリケーションのレポートツールとして使用する
[REST API] BigQuery API を使用して Google スライドのプレゼンテーションを生成する

9. 次のステップ: コードチャレンジ

この Codelab で作成したサンプルを強化または拡張する方法を以下に示します。このリストはすべてを網羅したものではありませんが、次のステップに進むためのアイデアをいくつかご紹介します。

アプリケーション - JavaScript の使用に制限されたり、Apps Script によって課せられた制限を受けたりしたくない場合は、このアプリケーションを、Google BigQuery、スプレッドシート、スライドの REST API を使用する任意のプログラミング言語に移植します。
BigQuery - 興味のあるシェイクスピアデータセットに対して、別のクエリを試してみます。別のサンプルクエリについては、元の Apps Script BigQuery サンプルアプリをご覧ください。
BigQuery - BigQuery の他の一般公開データセットを試して、自分にとってより意味のあるデータセットを見つけます。
BigQuery - 先ほど、シェークスピアの作品やその他の一般公開データテーブルを使用して作成できる他のクエリについて説明しました。これらは、こちらのウェブページとこちらの GitHub リポジトリで確認できます。
スプレッドシート - グラフギャラリーで他のグラフの種類を試してみます。
スプレッドシートと BigQuery - 大規模なスプレッドシートデータセットを使用します。2016 年に、BigQuery チームは、デベロッパーがスプレッドシートをデータソースとして使用できる機能を導入しました。詳しくは、Google BigQuery と Google ドライブの統合をご覧ください。
スライド - 生成されたプレゼンテーションに、ビッグデータ分析に関連付けられた画像やその他のアセットなどのスライドを追加します。スライドの組み込みサービスのリファレンスドキュメントは次のとおりです。
Google Workspace - Apps Script から他の Google Workspace サービスまたは Google の組み込みサービスを使用します。たとえば、Gmail、カレンダー、ドキュメント、ドライブ、マップ、アナリティクス、YouTube などのサービスや、その他の高度なサービスです。詳細については、組み込みサービスと高度なサービスの両方のリファレンスの概要をご覧ください。