ホームページに店舗や会社のマップを綺麗に表示したり、管理画面から住所を入力して自動でピンを立てたりするためには、Googleが提供している「Google Maps API」という機能と連携する必要があります。
費用
Google Maps APIは、毎月 200ドル(約3万円相当)の無料利用枠 が全ユーザーに付与されます。
- 無料枠の制限:一般的なホームページのマップ表示や住所検索であれば、月間数万回以上のアクセスまでこの無料枠の範囲内に収まります。
- 有料化の条件:無料枠を超過したアクセス分については、従量課金が発生します。
小規模〜中規模のサイトであれば無料の範囲内で十分利用できますが、利用にあたってクレジットカードの登録が必須となっています(無料枠内であれば引き落としは発生しません)。
使用条件
- Googleアカウントが必要です。
- クレジットカードが必要です(不正利用防止の本人確認および、無料枠を超えた場合の請求先として登録します)。
登録手順
①プロジェクトの作成と請求先アカウント(支払い情報)の設定
まずは、APIを利用するための「箱(プロジェクト)」を作り、そこに「お支払い情報」を紐付けます。
- Google Cloud Consoleにアクセス
Google Cloud Console にアクセスし、Googleアカウントでログインします。 - プロジェクトを作成する
画面上部の「プロジェクトを選択」から「新しいプロジェクト」を作成します。
プロジェクト名は「自社サイト用」など分かりやすい名前でOKです。 - 「お支払い」メニューを開く
左上のメニュー(三本線)から「お支払い」を選択します。 - 請求先アカウントを登録する
「請求先アカウントを管理」から、案内に従ってクレジットカード情報などを登録します。
※「個人」か「ビジネス」かを選択し、住所とカード情報を入力してください。 - プロジェクトにお支払い情報を紐付ける
作成したプロジェクトに、今登録した「請求先アカウント」が紐付いていることを確認してください。
②Maps JavaScript APIの有効化
- Google Cloud Console > 左上メニュー > API とサービス > ライブラリ をクリックします。
- 検索窓に「Maps JavaScript API」と入力して検索し、クリックします。
- 「Maps JavaScript API」を選択し、青い 「有効にする」 ボタンをクリックします。
③Geocoding APIの有効化
- Google Cloud Console > 左上メニュー > API とサービス > ライブラリ をクリックします。
- 検索窓に「Geocoding API」と入力します。
- 「Geocoding API」を選択し、青い 「有効にする」 ボタンをクリックします。
④Places APIの有効化
- Google Cloud Console > 左上メニュー > API とサービス > ライブラリ をクリックします。
- 検索窓に「Places API」と入力します。
- 「Places API」を選択し、青い 「有効にする」 ボタンをクリックします。
⑤APIキーの作成と取得
- Google Cloud Console > 左上メニュー > API とサービス > 認証情報 をクリックします。
- 画面上部の 「+ 認証情報を作成」 > 「API キー」 をクリックします。
- 表示された長い文字列が「APIキー」です。これをコピーして大切に保管してください。