久しぶりに、Google Map Apiを利用した、地図をサイト上に設置しようとしたところ

地図が一瞬表示された後に、エラーメッセージ「エラーが発生しました。」が表示されてしまう。（肝心の地図は表示されません）

コンソール画面（エラー内容）

common.js:47 Uncaught TypeError: Cannot read property 'prototype' of undefined

どうやら今年2016年6月22日から、API Keyの設定が必須になったらしいです。

（対象は新規サイトのみ。既存のサイトは、未設定のまま動作するようです。これもいつ仕様が変更されるのか？分からないため不安ですね）

Google Map API Keyの取得・設定方法

・Googleアカウントを既に持っていれば、ボタン一発で簡単にKEYを取得できます。

Google Maps APIs for Web  |  Google Developers

・取得したAPI KEYを、下記のタグのように、ページ内に記載するだけです。

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

すんなりと、地図が表示されるようになりました。

また、利用状況の詳細が、APIの管理ページから確認することができ、とても便利です。

Google Mapの利用にひと手間かかるようになりましたが、それ以上の情報が手に入るようになり、便利になりましたね。