0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Google Cloud APIを使ってみた(Maps JavaScript API編)

Posted at

概要

Google CloudのAPIでMaps APIというものがあり、気になったので使ってみようと思います
設定から料金と簡単な使い方まで2025年9月の情報で記録に残しておきたいと思います

本題

まずはAPIの概要についてですが、Google CloudのMaps関連のAPIは32個あります
よくウェブサイトなどでGoogle Mapを埋め込んだりするためにMaps Static API、Maps Embed APIがあります

さらに道案内や環境に関する情報を得ることができるAPIもありました

セットアップ

APIを使うために必要な手順を記載します
まずはどのAPIでも同じように、有効化する必要があります
例としてStatic Mapsを用います

スクリーンショット 2025-09-05 0.58.13.png

有効化すると次の画像のようになります
スクリーンショット 2025-09-05 1.22.10.png

管理を押すとAPIとサービスのページに遷移します
スクリーンショット 2025-09-05 1.25.26.png

先ほど有効にしたMaps Static APIを探し出して、Keysを押します
スクリーンショット 2025-09-05 1.26.09.png

認証情報を作成を押してAPIキーを発行します
APIキーには制限をかけなければ漏洩した際に悪用されることがありますので積極的にかけましょう
ただ、この場で作成したAPIキーについてはMaps系のAPIにのみ制限がかけられるている状態になっています
スクリーンショット 2025-09-05 1.27.38.png

以上でAPIの実行できる準備が完了したので、実行してみます
例としては以下のURLです
YOUR_API_KEYに先ほど発行したAPIキーで書き換えてアクセスしてみると地図が表示できると思います

https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY

スクリーンショット 2025-09-05 1.35.56.png

ここまでの手順は以下にもありますので参考にしてください
https://developers.google.com/maps/documentation/maps-static?hl=ja

料金形態

次に料金形態を確認してみます
毎月APIごとに無料枠が設定されており、Essentialsと呼ばれるものは10,000件、Proは5,000件、Enterpriseは1,000件まで課金されずに利用することができます

先ほど例で試してみたStatic MapsはEssentialsなので、こちらは毎月10,000件まで無料で使うことができます

それ以上リクエストしようとすると課金されるので利用用途に合わせていただければと思います

スクリーンショット 2025-09-06 13.56.09.png

終わりに

ということで今回はGoogle CloudのAPIでMaps APIというものを紹介・実際に使ってみました
もしも気になっている方がいましたら参考にしていただければと思います

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?