GoogleMapをレスポンシブ対応で埋め込む【API Key取得編】
お客様のサイトのイメージにあった配色でオリジナルのGoogleMapをレスポンシブサイトに！
まずは、Google Maps API Keyを取得する事から始めましょう。
Google Maps API Keyを取得する手順
※2016年6月からGoogle Maps API Keyが必須！
2016年6月22日から、Google Map APIの利用に開発者向けAPIキーが必ず必要になりました。
そのために、APIキーを使わずに新しくGoogle Mapを作成すると、
Google Maps API error: MissingKeyMapError
というエラーが発生し、地図が表示出来ない場合があります。
まずは「Google Developers Console」にアクセスします。
※アクセスするにはGoogleアカウントが必要です。
・Google Developers Console
https://console.developers.google.com/
プロジェクトを作成する必要があるので新規作成したらIDが自動で設定されます。
「Google Maps Embed API」を”有効”にして下さい。
APIキーを承認する必要があります。
必ず【HTTPリファラー（ウェブサイト）】にチェックを入れること！
これで完了です。
APIが承認され注意マークが消えていると思います。
※以前から使用されてる方はコードを下記コードに書き換えが必要です。
「XXXXXXXXXXXXX」の文字を、今回取得した「Google Maps API Key」と置き換えます。
それでは、API Key取得編は以上になります。