【コピペで使える】GASでスプレッドシートに画像を挿入してみる

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

スプレッドシートで資料などを作る際、画像を貼り付ける機会もあるかと思います。

通常のスプレッドシートの作業ですと、

貼り付けたい指定の場所のセルをクリック

挿入タブをクリックしセル内の画像もしくはセル上の画像をクリック

という大変長いプロセスがあってやっと画像が貼り付けられます。

セル内の画像であれば問題はないですが、セル上にするとサイズも調整しなければいけません。

そこで今回はinsertImageというメソッドを使って、

画像貼り付け 位置調整をスクリプトで設定してしまう方法をご説明していきます。

これが出来ると大量の画像貼り付け処理もストレスなく作れてしまいます。


スポンサーリンク

insertImageメソッド

class Spreadsheet

スプレッドシートの指定された行列に画像を挿入するメソッドです。

指定するデータとしてはURLとBlob形式があるので後ほど詳しく紹介します。

注意:初めてコードを実行する際にアクセス権限の許可を求められますが許可をしてください。アクセス権限についての詳細は以下の記事に詳しく載っています。

無料のGmailアカウントでGASに初回の実行許可を与える方法

insertImageの設定方法(URLで指定する場合)

insertImageメソッドの設定方法について説明します。

こちらではあらかじめ画像データのURLが分かっている場合の貼り付け方法です。

insertImage(URL,列、行)

画像のURLがわかっている場合はURLを用いて画像を貼り付けることができます。

今回はGoogle レファレンスのスクリプトを使用しています。

画像もリファレンスに記載してある画像を使っています。

以下のスクリプトをスプレッドシート内のスクリプトエディタに記載してください。

function insertImageWithURL1() {
  var ss = SpreadsheetApp.getActiveSheet();
  //シート1に設定するため[0]と記載します。
  var sheet = ss.getSheets()[0];
  //画像URLを変数URLに格納しています。
  var URL ="https://www.google.com/images/srpr/logo3w.png" 
  sheet.insertImage(URL, 1, 1); 
}

このスクリプトの流れとしては

2行目

現在開いているスプレッドシートを取得する

3行目

シート1を取得する

6行目

URLの画像を1列目 1行目に挿入する

このスクリプトを実行すると以下の画像のようになります。

この場合画像の位置はセルの左上を基準となるため左上に配置されることになります。

この位置を調整するために次の記載方法があります。

insertImage(URL,列、行、offsetX、offsetY)

Offsetについて

今回は先ほどの列、行に加えて

offsetX OffsetY

という入力値が追加されていますね。

今回はスプレッドシートのセルという枠が基準となるためセルの左上が基準となり

そこからX(横方向) Y(縦方向)に移動した位置ということになります。

図で表すと以下のようになります。

赤丸が基準点です。

以上の説明を踏まえて以下のスクリプトを説明していきます。

function insertImageWithURL2(){
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  //シート1に設定したいので[0]と記入します。
  var sheet = ss.getSheets()[0];
  var URL = "https://www.google.com/images/srpr/logo3w.png";
  sheet.insertImage(URL, 1, 3, 30, 30);
}

4行目までは先ほど作成したinsertImageWithURL1と同じです。

5行目のみinsertImage(URL, 1 ,3 ,30 ,30)となっていますので

1列目 3行目 X方向に30 Y方向に30移動した場所に画像が移動されます。

ですので以下の画像のように先ほどの1列目1行目の画像よりは中心に移動していることがわかります。

このようにして画像の位置を微調整することが可能になります。

では次にURLではなく画像のBlobを使って画像を取得していく方法を説明いたします。

insertImageの設定方法(Blob形式で指定する場合)

先ほどはURLが分かっている場合での画像挿入方法でしたが、

今回はBlob形式で挿入する方法をご説明します。

※注意点

Blob形式で画像を挿入する際の最大サイズは2MBまで

画像サイズは1024pixまで

これ以上のサイズで実行すると

サービスエラーとしてエラーがスクリプト上で表示されてしまいます。

この場合画像をリサイズする必要があります。

大量のデータを圧縮する場合はこちらの記事も参考にしてみてください。

【WEBアプリ】GASで超高速画像アップローダーを作ってみた

insertImage(blobデータ,列、行)

ではblobで作成するためのスクリプトを紹介します。

function insertImageWithBlob(){
  //画像IDは挿入したい画像から取得してください
  var fileId = DriveApp.getFileById("画像のID");
  //ファイルのBlob形式を取得
  var fileBlob = fileId.getBlob();
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  //シート2に挿入するため[1]と設定します
  var sheet = ss.getSheets()[1];
  sheet.insertImage(fileBlob,1,1);
}

実行したスクリプトを見ると画像が貼り付けらているのがわかります。

しかしながら画像のサイズが大きすぎてセルに上手く入っていませんね。

setHeight(高さ) setWidth(幅)で画像サイズを設定する

そこで今回は先ほどの画像サイズを調整するために

setHeightとsetWidthをinsertImageの後に追加します。

(注意点で指摘した1024以上のサイズの場合はこちらで設定してもエラーが出てしまいます。)

以下がスクリプトです。

function insertImageWithBlobChangeSize(){
  //画像IDは挿入したい画像から取得してください
  var fileId = DriveApp.getFileById("画像のID");
  //ファイルのBlob形式を取得
  var fileBlob = fileId.getBlob();
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  //シート2に挿入するため[1]と設定します
  var sheet = ss.getSheets()[1];
  //3列目 1行目に高さ100px 幅100pxの画像を設定しています。
  sheet.insertImage(fileBlob,3,1).setHeight(100).setWidth(100);
}

比較のため3列目に設置しています。

今回は極端に小さく設定しましたが、このサイズを調整することによってセルに合わせたサイズに画像を挿入することが可能になります。

insertImage(URL,列、行、offsetX、offsetY)

こちらはoffsetを使用した形でURLの時と同じ設定方法ですので割愛します。

まとめ

今回はスプレッドシートに画像を挿入するためのメソッドinsertImageについてご説明しました。

URLとBlob形式での挿入方法がありますので取得方法に応じて使い分けてみてください。

これを応用することによって

毎日撮影した写真を日付フォルダに入れ、写真に日付+特定名を設定する

その日付フォルダの中の特定名の写真を報告書に自動的に貼り付ける

なんてことも可能になりますので活用してみてくださいね。

ここまでご覧いただきありがとうございました。

 

SNSでもご購読できます。

商標および、登録商標について

Googleおよび、Googleロゴおよび、Googleドライブおよび、Googleドキュメントおよび、Googleフォトおよび、Googleスプレッドシートおよび、Googleサイトおよび、GoogleスライドおよびGmailおよび、Googleマップおよび、Googleタスクおよび、Google WorkspaceはGoogle LLCの登録商標です。

本サイトのコンテンツはいかなる場合においても、Googleから公式に提携及び承認されているわけではありません。

 

 

コメントを残す

*