マッチングサービスに地図を入れる方法

マッチングアプリ・マッチングサービスにおいて、地図は重要なアイテムです。
不動産系のマッチングサービスなら最も見られるのが地図のページでしょうし、『男女間マッチング』『職探しマッチング』等のサービスでも、地図があると便利です。

しかし実はこの地図というアイテム、地味に実装が大変なパーツだったりします。
本日はその点について解説したいと思います。
（なお、マッチングサービスに導入する前提にて記載をしていますが、一般的なアプリ・サービスへ導入する際にもご参考いただける記事となっています）

地図情報はどのような使い方ができるか？

まず最初に、マッチングサービスにおいて地図がどのように使われているかについて、分析してみましょう。

求職・転職向けサービスなら近い職場等を一覧化

働く場所や通勤時間は、就職する際とても重要な要素です。
気にしない方ももちろんいらっしゃると思いますが、実際のところ「1時間以上かけて通勤する人は通勤時間が30分未満の人と比べ、抑うつ症状を経験するリスクが16％も高い」という研究結果も出ています。
なので、自宅近郊や通勤時間に多くを割かれないよう、エリアを絞って就職・転職活動を行う方も少なく有りません。

不動産・店舗系は駅や場所を指定して周辺マップを表示

不動産や店舗系（飲食店や美容室等）マッチングサービスの場合も、マップは重要です。
こちらの場合はユーザーの現在位置を取得するよりも、希望の最寄り駅等を指定し、その近くにある物件や店舗を表示することが多いでしょう。

この場合、登録者に最寄り駅を入力してもらうことも可能ですが、
住所等から位置情報を取得し表示すると、より正確性の高いマッチングが可能になります。
（なお、後述するGoogle Map APIでは、位置情報を取得せずともおおまかなユーザーの位置を把握することが可能です）

男女間マッチングならTinderのような距離で検索

最後に『男女間のマッチングサービス』において地図を使う場合です。
こちらは『マップ上に表示する』というよりは、『近くの相手を表示する』という形で使うことが多いです。
アプリによっては『すれ違い機能』等で、生活範囲の近い人とマッチングすることもできます。

ただし、これらの実装を行う際には注意が必要です。
あまりに詳細な位置情報を利用した場合、ユーザー側で個人の位置情報を特定可能となってしまいます。
そのような事態を避けるために、あらかじめ精度を下げる等、工夫が必要です。

サービス内でのマップ実装方法

このように大変便利なマップ機能ですが、実装する際にはいくつか考えなければならない点があります。
いくつか手法をご紹介しますが、各手法それぞれにメリット・デメリットがあるので、比較検討を行ってください。

Google Map APIを利用する

言わずもがな、全世界で一番有名であり、一番使われているMapシステムです。
単純なマップ表示でも、Google Mapならば詳細で信頼度の高い情報を表示できます。

またそれだけでなく、数々の便利な機能・APIが用意されているため、複雑なシステムも実装可能です。
例えば経路検索や、交通機関を利用した場合の時間、運賃表示等も可能となっています。

Google Mapで用意されているAPI

• Google Maps JavaScript API: サイト・アプリ上に地図を表示
• Static Maps API: 高解像度の静的地図画像を表示
• Street View Image API: 高解像度のストリートビュー画像を表示
• Directions API: 最適化された経路検索を自動で実行
• Distance Matrix API: 複数の始点・終点の組み合わせルートの距離と時間を計算
• Roads API: 道路に沿ったスムーズなパスと制限速度情報を提供
• Geolocation API: GPS機能がない環境でもユーザーの位置情報を特定
• Places API: 1億件以上の施設情報を検索・表示
• Geocoding API: 住所と緯度・経度の相互変換
• Elevation API: 特定地点の標高（高さ）を取得
• Time Zone API: 特定地点のタイムゾーン（時間帯）を取得

そして『最も利用されている』ということは、WEB上に上がっているナレッジも多いということです。
各種APIの導入方法はもちろん、そのまま製品として使えそうなコードまで上がっています。例えば以下はGoogle Map APIを使ってUberのクローンアプリを作るコードです。

Building an Uber Clone with Flutter and Supabase Learn how to handle real-time geospatial data using Supabase supabase.com

よって一般的な用途でのMAP利用であれば、開発コスト等も抑えることができるでしょう。

……しかしながら、Google Map APIを使う場合、唯一の欠点があります。
それは『利用料金が高い』という欠点です。

例えば月間１万人のユーザーが、一人当たり5回『Maps JavaScript API』をリクエストしたとしましょう。それだけで350ドル（約5万円）がAPI費用として必要になります。（執筆時点の価格：詳しくはこちらを御覧ください）
１万人が全て有料会員であれば、なんてことない出費かもしれませんが、まだ収益を挙げていない１万人であれば痛い出費でしょう。

更に、Geocoding APIやDirections APIを使うのであれば、費用は更に嵩みます。もしGoogle Map APIを使う場合、使い所は慎重に選び、思わぬ出費に繋がらないよう気をつけてください。

OpenStreetMapを利用する

『Google Map APIは高すぎる……』と思われた方に朗報です。無料で使えるマップもあります。

『OpenStreetMap』はオープンライセンスで利用することができる地図です。
ウィキペディアや、オープンソースのソフトウェアが無料で使えるのと同じように、ライセンスで許可されている範囲であれば、商用・非商用を問わず自由に使うことが出来ます。

無料だからと言って信頼度が低いわけでは有りません。TeslaやUber、ポケモンGO等の著名なサービスでも、『OpenStreetMap』は使われています。

またGoogle Mapと違いオフラインで利用することもできるため、地域限定のマッチングサービスであればアプリ内にデータを組み込んでしまうことも可能です。
オープンライセンスなので、オリジナルの情報を書き込むことも自由に行えます。

ただし、『OpenStreetMap』が無料で提供できるのは、『有志が無償で地図の作成・更新を行っている』からです。
よってGoogle Mapよりも登録されている施設名は少ないですし、移転時等の更新も早くはありません。
それらの点も理解した上で使用を検討してください。

MapBoxを利用する

『Google Map API』は高いけれども、『OpenStreetMap』のように無料のサービスを使うのも不安がある……という方は、第三の選択肢『MapBox』を検討してみましょう。

『MapBox』はオンラインカスタムマップを提供する、アメリカ発のスタートアップサービスで、現在では多国籍に事業を展開しています。
日本法人も存在し、サービスサイトやサポートも日本語で提供されているため安心されてください。

『MapBox』のメリットは『安い』という点と『カスタマイズ性に優れている』という点です。

先ほどGoogle Map APIにて、月間１万人のユーザーが、一人当たり5回『Maps JavaScript API』をリクエストした場合、約５万円掛かるとお話しましたが、
同じ想定で計算した場合、なんと『MapBox』であれば無料です。（無料範囲内に収まるため）
無料範囲を超えたとしても、大抵のケースでは『MapBox』の方が安く済むことが多いと言われています。これは継続的にサービスを提供するにあたって大きなメリットです。

そして『MapBox』が優れているもう一つの点は『カスタマイズ性に優れている』点です。
GoogleMapでも多少の配色はいじることができますが、あくまでAPIに許された限られた範囲です。
しかし『MapBox』であれば、単純な配色はもちろん、道の幅・フォント・アイコン・テクスチャ等を細かく設定することが出来ますし、3D表記や重要許定のピックアップ等も可能です。

これらカスタマイズ性が優れており、デザイン的にも高度な描写が可能なため、『MapBOX』は各社カーナビなどでも利用されています。
また境界データ、交通量データなども提供されているので、これらの点でもGoogle Map APIに引けを取らない機能が提供されていると言えます。

ただし、『MapBox』をサービスに組み込む際のデメリットは、『ナレッジが少ない』ことです。
世界各国で利用されているサービスとは言え、Google Map APIに比べると利用ユーザーは多くありません。
個人開発者等も限られているので、ネット上で拾える知識やソースコードも限られます。

もしサービスに組み込む場合は、Mapboxや代理店と協議しながら進める形となるでしょう。
これらは利点でもありますが、『Google Map API』に慣れた開発者であれば、不自由さを感じるかもしれません。