サイト内の Google Map が突然表示されなくなっちゃったよ！という方へ

自分のサイトに埋め込んでいた Google マップが表示されなくなった。または、今までと同じコードを書いても新しいサイトでは表示されない。等の現象でお困りの方はコチラへ･･･

Google Maps API の仕様が変更されました

2016年6月22日に変更がありました。
具体的には Google Maps API を使うには API キーが必須になりました。

実は今までも API キーは必要だったのですが、別に無くても表示されるというゆるい仕様でした。
今回の仕様変更で新たなサイトでの利用には「必須」となりました。
やべえ･･･大量のサイトで API キー無しで使ってるよ･･･という方はご安心ください。
以前からあるサイトではそのまま地図が表示されるようです。
ただ、今後どう仕様変更されるかわかないので、以前からあるサイトも常に最新の仕様に合わせておくのが無難かと思います。

※条件は不明ですが、以前から Google Maps API を使っているサイトでも、地図が表示できなくなる場合があるようです。
その場合も API キーを追記することによって表示が回復します。

API キー･･･？

API キーなにそれ？な人も結構いるかと思います。
Google Map の API 使用は本来登録制なので、最初に登録してキーを発行する必要があります。
API キーの発行自体は簡単です。

https://console.developers.google.com/

・「Google APIを利用する」をクリック
・「プロジェクト名」に適当な名前を入力し「作成」
・「概要」>「Google API」から必要な API を選び「有効にする」
・「認証情報に進む」
・「使用する API」→ 選択した API
・「API を呼び出す場所」→ ウェブブラウザ
・「名前」にキーの名前を入力
・「この HTTP リファラー～」に使用するサイトのドメインを入力
　例）klutche.org/*
・「APIキーを作成する」で API キーが発行されます

API の種類がいっぱいあるよ

有効にする API を選ぶ所で戸惑う人もいるかと思います。
Google Maps API の中にも API の種類がたくさんあります。

ウェブで使う主なものは

Google Maps JavaScript API
Javascript を使って地図を表示する場合に必要です。

Google Static Maps API
img タグを使って地図画像を呼び出す場合に必要です。

Google Maps Embed API
iframe を使って地図を埋め込む場合に必要です。

基本この辺だと思いますが、使ってる機能によっては、他のものが必要な場合があります。

Google Maps Geocoding API
住所から座標を割り出す場合に必要です。

必要なものは全て「有効にする」必要があります。

API キーの使い方

Javascript を使う場合

<script src="https://maps.googleapis.com/maps/api/js?key={APIキー}"></script>

API の URL に key= API キーを追加します。

静止画像を使う場合

<img src="http://maps.google.com/maps/api/staticmap?center=36.566442,137.662105&zoom=14&size=240x240&key={APIキー}">

画像 URL に key= API キーを追加します。

iframe を使う場合

<iframe src="https://www.google.com/maps/embed?pb=･･･&key={APIキー}"></iframe>

src の URL に key= API キーを追加します。

Google Maps API って無料じゃないんだぜ

上記の方法で API を使えるようになりますが、実はキーの登録以外にも API の使用には制約があります。

「標準版」と「プレミアム版」があって、表示回数に制限があります。
制限回数を超えたものに関しては課金対象になります。

価格とプラン

例えば Google Maps JavaScript API だったら1日あたり25,000回の地図読み込みを超えた分は、1,000回ごとに$0.5の課金です。

制限回数に達しても地図が表示されなくなることはありません。
ただし、制限回数を超えた分に関しては課金対象になります。

API キーが必須になることにより、Google アカウントとガッチリ紐付けられ、課金が発生した場合はキッチリ請求される可能性が高くなったということですね。

古い記事へ