Google Map API のキーを取得して地図サービスの利用を始める方法


[初回公開] 2020年09月13日

Google Map を利用を始めるためには Google アカウントがあれば無料で誰でも利用できていたが、2018 年の Google Maps Platform へ移行してからは Google アカウントにクレジットカードの紐づけが必要となり API キーの取得方法が異なるようになったため、キーを取得して地図サービスの利用の始め方を紹介する。

Google Map API のキーの取得とサンプルコードを入手する方法

1.Google Maps Platform とは

Google Maps Platform とは、2018年06月に Google Map に関連する地図サービスを全て一つの Google アカウントで管理できるように統合されたものである。



統合する以前は JavaScript 版や Static 版などそれぞれで API キーを取得していたものが、Google Maps Platform により認証で利用する API キーの管理と利用する API の有効と無効も簡単に行うことができるようになった。

Google Maps Platform のウェブサイト

また、API の利用状況もグラフ化して確認できるようになった。

2.Google Maps Platform と旧 Goole Map API の違い

Google Maps Platform と旧 Goole Map API の違いは、地図を利用するために必要な API キーの管理方法とクレジットカード番号の必要の有無である。

旧 Goole Map API ではバラバラだった地図サービスに関連する API キーが Google Maps Platform により統合管理できるようになった。
例えば JavaScript 版と Static(画像)版では API キーが異なっていたが、Google Maps Platform では 1 つのキーで利用できるようになっている。

ただし、JavaScript 版で地図の表示や操作に必要な関数類は Google Maps Platform になっても引き継がれているため、API キーのみ変更すればプログラムの変更無しで継続して利用することができる。

また、旧 Goole Map API で利用していた無償版の API キーは Google Maps Platform では利用できなくなり、2018年06月の Google Maps Platform 移行の後は地図を表示しようとすると警告文が表示されて利用できなくなった。



これは Google Maps Platform から Google アカウントにクレジット番号の紐づけを義務づけたことにあるが、旧 Goole Map API の有償版を利用しているユーザは既に支払い登録ができているので API キーの変更をすることなく継続して利用できるようになっている。

尚、Google Maps Platform では利用する Google アカウントにクレジット番号の紐づけが必要になったものの、月額 $200 分までは無料で利用することができる

そのため、地図を表示するだけなら月に 28,000 回までは無償枠で収まり、それを超えたものは 1,000 回を超えるごとに $7 の重量課金となり登録しているクレジット番号に請求が来る。

もちろん、無料枠を超えないように Google Maps Platform 内で表示制限を設定することができ、設定値に利用が達すると自動的に利用できなくなり従量課金されないようになる。

3.Google Maps Platform で API キーの取得と地図サービスを始める方法

Google Maps Platform で API キーの取得と地図サービスを始める方法としては、無料体験版に申し込みを行った後に、利用したい Google Map の機能を有効化するだけでよい。

その後はアカウントごとに提供される API キーを地図を表示するためのコードやタグの中に埋め込んでインターネット上に公開すると Google Map の地図サービスを利用することができる。

3-1.Google Maps Platform の無料体験版に申し込む

まず最初に、Google Maps Platform の無料体験版に申し込むために事前に用意した Google アカウントで Google Maps Platform にログインする。

まずステップ1として下図のように利用規約の確認と最新情報をメールで受け取るかのチェックを行う。
利用規約にチェックを入れるのは必須だが、最新情報の通知は任意の選択となっている。
必要な箇所にチェックを入れた後はボタン「続行」をクリックする。

ボタン「続行」をクリック


次に登録のステップ2では Google アカウント登録時の情報が表示され、支払い方法を入力する。
「カードの種類」を選択するとクレジット番号や有効期限を入力するフォームが表示され、入力を終えればボタン「無料トライアルを開始」をクリックする。

ボタン「無料トライアルを開始」をクリック

3-2.利用する Google Map サービスを選択し有効化する

Google Maps Platform が利用できるようになると、次は提供されている Google が提供する地図サービスの機能を選択する。
Google Map と言ってもスマートフォンのアプリに利用する「Maps SDK for Android」や指定する地点の周辺情報を取得する「Places API」など 20 以上の機能がある。
よく利用されているのはウェブサイト内に Google Map を埋め込む「Maps JavaScript API」となり、今回はこれを有効化する。

「Maps JavaScript API」をクリック

尚、Google Map に関連する API を表示するためには「Google Maps Platform」からでも「Google Cloud Platform」からでもどちらの画面からログインしてもログイン後は「Google Cloud Platform」が表示される。

すぐに Google Map に関連した API だけが表示されたダッシュボードを出したい場合は「Google Maps Platform」からログインした方がよい。

次に「Google Maps Platform」が表示されれば、左メニューより「API とサービス -> ライブラリ」を選択すると、下図のように「API ライブラリへようこそ」が表示されるので、その中から「Maps JavaScript API」をクリックする。

「Maps JavaScript API」をクリック

「Maps JavaScript API」をクリックすると Maps JavaScript API の概要やドキュメントへのリンクが表示される。

Maps JavaScript API を有効化する


上図では既に API が有効になっている状態だが、ボタン「有効化」をクリックすると API が利用できる状態となり、ボタン名が「管理」に変更される。

3-3.Map JavaScript API のキーを取得する

Maps JavaScript API を有効化しただけではまだ API を利用することはできず、アカウントごとの認証情報となる API キーを取得する必要がある。
この API キーをプログラム内に埋め込むことで初めて地図が正常に動作する。

前項のボタン「管理」をクリックすると認証情報の画面が表示され、画面上部の「API のサービスの認証情報」をクリックすると API が自動的に発行される。

発光した API キーの管理画面

発行された API キーは上図のように一覧で表示され、キーの欄にあるコピーマークをクリックするとクリップボード上(パソコン上の一次メモリ)にコピーされるので貼り付けて利用することができる。

3-4.Map JavaScript API のサンプルコードを取得する

Google Map の API キーが取得できれば、Google Map のチュートリアルやドキュメントを見ながらプ地図サービスをウェブサイトなどで表示できるようにプログラムする。

基本形となるサンプルのコードは Google Cloud Platform にログインした状態で左メニューより「API とサービス -> ライブラリ」を選択し、Map JavaScript API をクリックした画面内から「ドキュメント」選択する下図のようにサンプルコードが表示される。

Maps JavaScript API のサンプルコードの入手


ドキュメントの左メニューには各種関数の一覧があり、Google Map のバージョンアップにより機能追加された場合は新たに説明書として追加されていく。
定期的にこのドキュメントを参照して関数を眺めるだけでも自身が知らない Google Map の使い方の知識が広がるだろう。

4.Google Maps Platform 以前の API キーの取得の方法

現在では利用できないが Google Maps Platform に統合される以前の、旧 Google Map API の取得方法が次の通りである。
旧 Google Map の API キーを取得するためにも Google アカウントは必要となるため、まず Google アカウントを取得する。

Google アカウントの取得

次に Google にログインした状態で、Google Maps のサイト(現在は閉鎖されている)にアクセスすると Google Map を利用するためのキーを発行するサイトが表示される。

旧 Google Maps のサイトにアクセスした様子

上図の「Sign up for a Google Maps API key」をクリックすると下図の同意画面が表示され、同時に Google Map を利用する URL を入力する欄が表示されるので URL を入力する。

Google Maps の同意画面と利用するサイト URL の入力する画面


Google Map を利用するウェブサイトの URL を入力すると下図のように API キーとサンプルコードが表示されるのでこれらをコピーした後に HTML ファイルに貼り付けてブラウザで表示すると地図が表示されるのが確認できる。

Google Map API キーとサンプルコードが表示される様子

サンプルコードで初期表示される場所はアメリカとなっており、地図を拡大縮小するスライダーなど何もない状態となっている。
ここから必要な機能を Google Map のドキュメントを参照しながら追加する流れとなる。

サンプルコードで Google Map を表示した様子

関連記事

コメントを残す