L O A D I N G

SNS

MENU

CLOSE

0422-70-3802

C O N T A C T

1
EN

HELLO!

JP

CONTACT - STEP01

お問い合わせ内容を以下の中から選択してください。

お仕事のご依頼
採用のお問い合わせ
その他お問い合わせ

CONTACT - STEP02

以下の項目よりご依頼内容を選択してください。

ブランディングに関するお問い合わせ
ディレクションに関するお問い合わせ
制作全般に関するお問い合わせ
デザインに関するお問い合わせ
開発に関するお問い合わせ

CONTACT - STEP03

以下よりご予算を選択してください。

APPROXIMATE BUDGET
0 yen
0 yen
~
2,000,000 yen
~
4,000,000 yen
~
6,000,000 yen
~
8,000,000 yen
~
10,000,000 yen

CONTACT - STEP04

以下よりプロジェクトの公開日を選択してください。

ESTIMATED TIMELINE
0 month
0 month
~
1 month
~
2 month
~
3 month
~
4 month
~
5 month
~
6 month

CONTACT - STEP05

以下のフォームよりプロジェクトの情報を入力し、
プライバシーポリシーをご確認の上、確認画面へ進んでください。

NAME ✳︎
COMPANY ✳︎
E-MAIL ✳︎
TEL ✳︎
INQURY CONTENT ✳︎

CONTACT - STEP02

以下の項目より職種を選択してください。

ディレクター
デザイナー
ディベロッパー
その他

CONTACT - STEP03

以下よりご経験年数を選択してください。

YEARS OF EXPERIENCE
1 year
0 year
~
1 year
~
2 year
~
3 year
~
4 year
~
5 year
~
6 year
~
7 year
~
8 year
~
9 year
~
10 year

CONTACT - STEP04

以下の項目よりご希望の雇用形態を選択してください。

正社員
契約社員

CONTACT - STEP05

以下のフォームより志望動機をご記入ください。

NAME ✳︎
ORGANIZATION ✳︎
E-MAIL ✳︎
TEL ✳︎
URL ✳︎
INQURY CONTENT ✳︎

CONTACT - STEP02

以下のフォームより情報を入力し、
プライバシーポリシーをご確認の上、確認画面へ進んでください。

NAME ✳︎
ORGANIZATION ✳︎
E-MAIL ✳︎
TEL ✳︎
INQURY CONTENT ✳︎
STEP01

C L O S E

S U B M I T

CONTACT COMPLETE

お問い合わせありがとうございます。
お問い合わせ内容を確認させていただき次第、担当者より返信させていただきます。

THANK YOU
CLOSE

NEWS

BLOG Nov.12.2019

MapAPIの利用にあたって

by Hirokazu Goto

SHARE

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

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/

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

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

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

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

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

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

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

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

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

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

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

GoogleMap

MapBox

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

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

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

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アクセスまで無料
  • 各月末日の月間使用量で判定
  • 管理画面より使用の上限設定が可能

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

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

どちらも座標は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を利用するにあたって把握しておくべきことをまとめさせていただきました。主に制作者がお客様へのご説明、どの地図サービスを利用するかの判断基準としてお役に立てばと思っています。

それではっ。

by Hirokazu Goto

SHARE

OTHER ARTICLES

BLOG
Aug.04.2019

オブジェクトの配置方法で書き出し画質が変わります

by Daisuke Ishiyama

TOPIC
Apr.19.2019

2019年 G.W.休暇のお知らせ

by Mami Ohtani

TOPIC
Dec.08.2016

年末年始の休暇のお知らせ

by Staff

SCROLL TO
CLICK TO
N E W S   A L L
TAP TO NEWS ALL