#はじめに
GASは緯度経度情報を与えて周辺の地図画像を動的に作れます。GoogleMapsのスクショみたいな感じで、かなり便利だと思います。
ただそれをWebAPI的に使いたかったんですよね。結果としてはどうもそれは難しいっぽいです。
(アクセスしたら画像データがレスポンスでくるようにしたかった。)
ということで
・緯度経度情報から動的に地図画像を作る
・Driveにアップロードする(全体に公開する権限を付与)
・そのアップロードされた画像のURLを返す。
という苦肉の策にでました。
その話をします。
#コード
var saveImageFolderID = "セーブ先のDriveのフォルダID";
//Getリクエストが来たときに呼ばれるメソッド。
function doGet(e) {
//緯度経度をパラメータから取得
var lat= e.parameter.lat;
var lon = e.parameter.lon;
//MapのBlob(Binary Large Object)を作る。
var map = Maps.newStaticMap()
.setLanguage("ja")
.setSize(512, 512)
.setZoom(15)
.setCenter(lat,lon)
.addMarker(lat,lon)
.getBlob();
//GetSavedImageID()メソッドでURLを作成し、レスポンスする。
return ContentService.createTextOutput(GetSavedImageID(map));
}
//Blob情報から画像を特定のフォルダに公開権限をつけてアップロード
function GetSavedImageID(blob){
//フォルダのインスタンス取得
var folder = DriveApp.getFolderById(saveImageFolderID);
//blobから画像を作成
var file = folder.createFile(blob);
//権限付与
file.setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.VIEW);
//アップロードが終わったらIDを取得してアクセス可能なURL化して返す。
return "http://drive.google.com/uc?export=view&id=" + file.getId();
}
これだけです。
#結果
あとは公開->ウェブアプリケーションとして導入でこのスクリプトへのアクセスURLを取得します。
そして
アクセスURL?lat=40.759011&lon=-73.984472
のようにパラメータをつけてアクセスすると
のような画像へのアクセスURLができます。
このような画像が得られます。
たぶんZoom変数とかサイズとかはパラメータでカスタマイズできたほうがいいですね。
#感想
GASのMapに関するドキュメントを見ると
https://developers.google.com/apps-script/reference/maps/static-map
SetCenterでは緯度経度だけではなく、名前(文字列)を元に地図画像の中心を定義できます。
これは凄いことで、例えば.setCenterの引数を'渋谷駅'にすると
この画像のアクセスURLが取得できます。何この便利さは。
この記事はWebAPI化としたことに意義があるんですが、本当は画像を返すことができたらよかったですね…。やり方ないのかな。