今回は、Google スプレッドシート上の図形でボタンを作成し、スプレッドシートの拡張機能「GAS(Google Apps Script)」のコードを埋め込む方法を紹介します。

GASの拡張機能の概要は、以下の通りです。

サービスの概要

Googleアカウントがあれば、誰でも無料で利用可能
GmailやGoogleカレンダー、スプレッドシートなど、Googleのさまざまなアプリに利用可能
自動化、アプリ間の連携など業務の効率化を実現
JavaScriptを踏襲しているため、WEBエンジニアには学習ハードルが低い
Googleアプリと外部アプリとの連携が可能

拡張機能なので、使えるように設定をする必要があります。一方で、設定方法も意外と簡単なので、すぐに試すことができると思います。

以下の記事に詳しく説明しております。

www.brain-a-campus.com

今回は、その作成したGASコードをスプレッドシートで作成した図形のボタンの中に埋め込むやり方になります。

［作成者：ます］文系から情報科・数学科教員(2年目)

元塾講師6年 / 2023年度第１志望校合格率 "71.4％"達成！（難関校合格あり）

高校数学・情報の教員免許取得！（元科目等履修生［２年間］）

文系で大学の情報学部に入学 / ITパスポート・基本技術者試験に合格！

スプレッドシート上に図形のボタンを作成する方法
- 準備
  - 新しくスプレッドシートを作成
  - 図形をシート上に挿入する
  - 補足：図形の拡大縮小
- GASコードを図形のボタンに挿入する
  - 「スクリプトを割り当て」を選択
- 確認
最後に

スプレッドシート上に図形のボタンを作成する方法

準備

新しくスプレッドシートを作成

まずは、Googleスプレッドシートに移動してください。クリックすると以下の画面に移動します。

新しくスプレッドシートを作成するには赤丸を押してください。

この画面が開けたらOK

新しいスプレッドシートが作成できました。

図形をシート上に挿入する

コードを記入する

横に並んでいるツールの「挿入」を選択し、「図形描画」をクリックする

以下の画面が表示されたらOK

赤丸を押すと図形が選択できるので、お好みで選んでください。

文字を図形の中に入れたいときは左クリックを2回すると文字を挿入・編集できます

図形を編集出来たら「保存して閉じる」をクリック

以下の画面が表示されたらOK

補足：図形の拡大縮小

マウスで右クリックすると下のように図形の拡大縮小ができます

GASコードを図形のボタンに挿入する

ボタンが完成したら、次はGASコードを埋め込みます。

「スクリプトを割り当て」を選択

以下の画面が表示されたらOK

スクリプトはプログラムコードをまとめたものです。

下のGASコードの例を使って、割り当てについて説明します。拡張機能GAS(Google Apps Script)に移動すると分かりやすいです。

今回は「セル(A1)に『こんにちは』と出力」するコードになります。

コードは以下の通りです。


function myFunction() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getActiveSheet();
  var cell = sheet.getRange("A1");
  cell.setValue("こんにちは");
}

この中で、スクリプトは「myFunction」と書かれているところになります。つまり、プログラムコードをまとめている箱の名前と思ってくれると嬉しいです。

それを先ほどの「スクリプトを割り当て」に記入してください。問題なければ「確定」ボタンを押してください。

以下の画面が表示されたらOK

以上で完成になります。

確認

それでは、正常に動作するか確認しましょう。

しっかりと青い四角のボタンをクリックすれば、「こんにちは」と出力されました。

成功です！

最後に

設定、お疲れ様です！

いちいちGASに訪れ、スクリプトを実行するのがめんどくさい方にはオススメです。

Brain Campus

教育業界/教員を目指している方、現職の方向けに有益な情報を発信！