私のサイトの Embed を使った一部の地図に「このページでは Google マップが正しく読み込まれませんでした。」とエラーが出て、地図が表示されていないことに気づいた。 今まで Embed API はすべて無料で使えたが、2018年に Maps 関連にいろいろ変更があり、Embed にも制限が付いたようだ。
2018年現在の料金プランは 料金表 | Google マップ プラットフォーム に書かれている。 Embed は、通常の Embed と Embed Advanced に分かれて、Advanced は有料になった。
ただの Embed で使えるのは Place モードと View モードで、使用無制限となっている。 Directions、Search、Street View の各モードは Advanced、つまり有料。 私のサイトでエラーが出た地図は Search モードを使っていた。 それを Place に変更したところエラーが出なくなった。 Place でも場所に関するクエリーを送って地図を表示できるので、とりあえずこれが使えれば今までどおりやっていけそうである。
この地図は要するにGoogleマップで［共有］→［サイトに埋め込む］でやってることとほぼ同じだが、埋め込みと違うのはクエリーを自分で指定しやすい点。
Google Maps Embed API のデベロッパーガイドのページ Developer Guide | Maps Embed API に導入方法や仕様、サンプルが書いてあるので、この通りやればできる。
Google Developers Console にログイン後、「Google Maps Embed API」の「割り当て」タブを見るとマップ表示は1日200万回と書かれていて、それ以外は無制限となっている。
Google Maps Embed API の導入手順としては
の2ステップだけ。
上述のデベロッパーガイドのページにも書かれているGoogle Developers Consoleのリンクからログインして API キーを作成する。 一応日本語に対応しており、手順通りに進めればAPIキーを作成できる。 この Console では様々な API を管理できるが、Google Maps Embed API の API キーを作り、それを有効にする。
左のメニューの［ダッシュボード］をクリックすると、右のページの下に有効なAPIのリストが表示される。 左のメニューの［認証情報］でAPIキーの作成、編集、削除ができる。 APIキーの設定には、APIキーを使用するサイトのドメインやサーバのIPアドレスなどを指定（制限）できる。
Google Maps Embed API は他の Maps API と比べると機能は少ないが、使い道はあるだろう。 以下のような機能（マップモード）がある。
そして以下のような HTML をページに貼る。
<iframe
width="600"
height="450"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=YOUR_API_KEY
&q=Space+Needle,Seattle+WA" allowfullscreen>
</iframe>
これはPlaceモードの例で、Searchモードの場合はURLのplaceの部分をsearchに、Directionsモードの場合はdirectionsに変える。 YOUR_API_KEY は自分のAPIキーを使う。
SearchとPlaceは、Googleの検索結果と同じように必ずしも正確とは言えず、クエリに指定したワードの位置を正しく表示するとは限らない。 ただ、場所を一意に識別するプレイスIDが使用でき、プレイスIDが分かればより正確に位置を表示できる。
また、以下のパラメータを付加でき、省略しても良い。
