This page is intended for users in Hong Kong. Go to the page for users in United States.

MapAPIの利用にあたって

こんにちは。ディベロッパーの後藤です。

2018年6月11日のGoogleMapsAPIの料金体系が変更されて以降、クレジット情報の登録が必須になったり、地図情報を提供していたゼンリンがクレジットからぬけたりと、度々GoogleMapに関するお話が話題になります。

GoogleMap以外の選択肢として様々な地図アプリケーションが提供されていますが、ゼンリンが提携したという流れもありMapBoxと悩むことが多いです。

今回はWEB制作のお仕事をされている方々が地図描画させたい場合に把握しておくべきこと、各サービスを利用するために必要な情報、各サービスの料金体系についてまとめてみます。

目次は下記となります。

  1. 制作者が事前に把握しておくべきこと
  2. APIキーの発行方法について
  3. 料金体系について
  4. おまけ(初期表示のパフォーマンス)

※2019年7月5日段階での調査になります。

GoogleMap
https://cloud.google.com/maps-platform/
Mapbox
https://www.mapbox.com/

1.制作者が事前に把握しておくべきこと

GoogleMapとMapBoxはどちらも無料枠がある従量制になります。
従量制とは利用量に応じて料金が決まるということです。

難しいところなのですが従量制は、
どのサービスをするのか
どのように実装されるのか
どのAPIを利用するのか
によって計算方法が異なり、請求が発生する可能性が変わることを理解しておくことが必要となります。

例えばGoogleMapで地図を利用する際に、
「地図だけ表示をさせたい」場合


または、「地図表示をしてユーザにルート検索もできるようにしたい」場合

上記だと後述したパターンのほうがリクエストが多く発生するため、無料枠を超えてしまう可能性が増えてしまいます。

そして
「地図だけ表示させたい」
を選ぶ場合も実装方法によって請求が発生しうる可能性が変わってきます。

ピンの配置や一部機能は制限されるものの、どんなにアクセスされても料金は発生させたくないという場合は iframe配置することによる地図描画(MapsEmbedAPI)を利用すれば、どれだけアクセスしても請求が発生しない形でGoogleMapを利用することが可能です。
※APIキーの発行は必須となります。

このように配置しようしている地図には、機能的に何が必要なるのか、どういったリスクがあるのかをお客様とお話しして適切に選択する必要があります。

2.APIキーの発行方法について

どちらも従量制となるためユーザー情報とクレジット情報を登録が必須となります。
APIキーの発行についてはどちらのサービスも必要な情報は同じとなります。

GoogleMap

  • Google Maps Platformへの登録
  • クレジット情報の登録
  • 利用するプロジェクトごとのAPIキーの発行して開発者に共有

MapBox

  • MapBoxへの登録
  • クレジット情報の登録が必要
  • 利用するプロジェクトごとのAPIキーの発行して開発者に共有

3.料金体系の比較について

どちらも無料枠がある従量制になります。

GoogleMapの料金体系

冒頭の例えでも記載しましたが、どの機能が必要になってくるかで想定すべき内容が変わってきます。静的な地図描画だと100,000アクセスまで無料、2点間を検索するルート検索は月間40,000リクエストまで無料といった計算になります。

各APIの料金体系については下記をご参照ください。
https://cloud.google.com/maps-platform/pricing/sheet/?hl=ja

  • 従量制
  • 請求先アカウントごとに1ヶ月200ドルまで無料
  • 各APIの利用料に応じて請求が発生
  • 各月末日の月間使用量で判定
  • 使用の上限設定がGoogle Cloud Platformのコンソールから設定可能

MapBoxの料金体系

MapBoxは先日メジャーアップデートがあり、利用料金の計算方法が変更となりました。
以前はユーザーが地図の状態(ズームや移動など)を位置を変更するたびにカウントが増えるようになっていたのですが、v1.0.0以降は地図が読み込まれたときにカウントされるようになったため、ユーザーの操作によるカウントが増えることはなくなりました。

MapBox料金体系
https://www.mapbox.com/pricing/

  • 従量制
  • 請求先アカウントごとに50,000アクセスまで無料
  • 各月末日の月間使用量で判定
  • 管理画面より使用の上限設定が可能

4.おまけ(初期表示のパフォーマンス)

少し開発者向けのお話になってしまいますが、ピン配置や地図のデザイン変更を前提とした状態で、初期表示のロード時間を比較してみます。

どちらも座標はUNIEL近辺でzoom値を揃えて比較してみましょう。Styleはシンプルなテンプレートを読み込んでいます。

GoogleMap

MapBox
MapBoxは先日メジャーアップデートがあったため、v0.53.0とv1.1.0でのロードで比較してみます

v0.54.0以前のバージョンでは事前に描画する際にフォントデータのロードを行っていたのですが、日本語のフォントデータをロードするのに時間かかってしまい、初期表示に時間がかかるという欠点がありました。

ローカルのフォントデータ読み込むためのオプションとしてlocalIdeographFontFamilyが追加されたのですが、デフォルトではfalseとなっており、開発者側でオプションの設定で有効にする必要がありました。

v0.53.0

v0.54.0以降のバージョンではlocalIdeographFontFamilyがデフォルトで有効になるようになっており、ローカルで測定した状態でも3000msほど早くなっていることがわかります。

v1.1.0

スタイルを変更した地図の描画についてはGoogleMapのほうが早いですね。

まとめ

GoogleMapとMapBoxを利用するにあたって把握しておくべきことをまとめさせていただきました。主に制作者がお客様へのご説明、どの地図サービスを利用するかの判断基準としてお役に立てばと思っています。

それではっ。

UNIEL ltd.'s job postings
1 Likes
1 Likes

Weekly ranking

Show other rankings
If this story triggered your interest, go ahead and visit them to learn more