MapAid+Biz の開発
TM～Google Maps

API を用いた位置情報サービスの展開～
ソリューション本部 開発二部
田尻 浩人

３. 本システムにおける Google Maps

１. はじめにAPI プランの適用について

MapAid+Biz は、Google Maps API を用いて構築された位置情報サービスである。顧客の情報本システムでは、Google Maps API プレミアを地図上にプロットすることで可視化し、統計ムプランの適用が必須であるが、課金のしかた情報との重畳等により付加情報を与えるシステには以下に示す２通りの形態があり、いずれのムである。本稿では MapAid+Biz の機能紹介に形態を利用するかはユーザ毎に選択することが加え、Google Maps API をシステムにて適用すできる。

る場合の利用例ならびに、大量データの扱い方①

API プレミアムライセンスの買い取りについて述べる。

②

利用者毎に月額課金での利用

後者の場合、OEM ライセンスを応用技術株

２. Google Maps API とは式会社が取得し、個別に卸しを行う形となる。

Google Maps API とは、Google が提供する①のプレミアムライセンスは高額である為、小Google マップをプログラムから操作すること規模のユーザ（約 25 人以内）では、②のライの で き る イ ン タ ー フ ェ イ ス で あ る 。 Googleセンス形態の方が有利となる。

Maps API を用いることにより、Google マップを取り込んだシステムを開発することができる。

４. ソフトウェア 構成

Google Maps API を使用する場合、無料で対外的に公開しているサイトに利用できるスタン

MapAid+Biz の開発に使用したサーバのソフ
トウェア構成は、図１のとおりとなる。

ダードプランと、有償または非公開のサイトに利用できるプレミアムプランが存在する。
本システムは、企業の社内情報を扱うサイトであり、ログイン機能にてユーザを制限する仕組みであるため、必然的にプレミアプランが適用される。
図１ ソフトウェア構成図（サーバ）※「Google Maps」は、Google, Inc. の商標または登録商標です。

− 23 −

1/6

地図機能に、Google Maps API を採用したこと

ル等で保有していた情報を簡易に本システムににより、GIS サーバの自社構築が不要であり、投入することができる。
また本システムでは、Google Maps 上へ大シンプルな構成となり運用負荷を低減している。

量の地物を表示するため、様々な対策をおこ

５. MapAid+Biz 実装機能
ここでは、MapAid+Biz における代表的な実なっている。この対応については後述する。
（６.Google Maps 上での大量地物描画 参照）

装機能について、Google Maps API の実装例として紹介する。

５.２ ヒートマップ表示機能
Google Maps API では、簡易にヒートマッ

５.１ ユーザ情報地物表示機能
Google Maps API の機能を利用して、プを作成することができる。MapAid+Biz では、ヒートマップ表示にてユーザのデータ分布

MapAid+Biz では座標付与されたユーザ情報をを視覚的に表現することができ、顧客傾向の分Google Map 上に表示できる。

析やその対策を立案することができる。

図２ 地図を用いたユーザ情報表示
図３ ヒートマップを用いたユーザ情報表示

地図上のユーザ情報をクリックすると、ユーザ情報の詳細を属性情報として表示することができる。ユーザ情報を地図上に可視化すること

５.３ 統計情報等表示機能
Google Maps AP では、ポリゴン、ライン等

により、位置情報を加味した行動計画や営業戦略立案などを行うことができる。
ユーザ情報は、管理者機能により個別編集、の Geojson のデータをレイヤとして重ねることができる。

参照ならびに CSV 形式でのエクスポート/イン

MapAid+Biz の場合、データベースに格納ポートが可能である。インポートでは、された様々な統計情報を Geojason 形式にオン

Google Maps Geocoding API を用いて、住所デマンドで変換し、表示を行っている。

情報を座標変換することができるため、エクセ− 24 −

2/6

６. Google Maps 上での大量地物描画
本章では、Google Maps 上で大量の地物情報の扱い方について述べる。

６.１ Google Maps 上での大量地物描画
Google Maps API で地物を描画する際は、Google Maps Javascript API を用いて描画を行う。Javascript API という名が示すとおり、Web ブラウザを表示している端末で描画処理

図４ 統計情報の表示例が行われている。
このような仕組みで動作する都合上、表示す５.４ グラフ表示機能るためのデータをサーバから取得する時間に加ユーザ情報のうち、数値情報をグラフ化してえ、描画に用いる時間が掛かるため、一般の地図上に表示することができる。これは、カスGIS エンジンと比べて大量の地物表示には不タムオーバレイという、画像をレイヤとして追向きである。

加する機能を利用して実装している。

下記に、特に対策を行っていない状態で大量画像の描画部分は、Google Map API とは別の画像エンジン（d3.js）を用いて行っており、データの地図表示を行った例を示す。

アニメーション効果も使用してグラフ表示を行っている。この手法は、実装次第で地図上における様々な表現が可能である。

図６ データ表示サンプル（2015 件）
図６のように 2000 件程度のデータであれば、2～3 秒で表示が行われる。（端末スペック：
図５ Google Maps 上にグラフ表示

CPU Intel Core i5-2520M/RAM 8GB）このくらいのレスポンスであれば、快適に操作できるといえる。

− 25 −

3/6

６.２.１. 解決策①
解決策①は、小縮尺（縮小状態）での表示時に、地物情報のポイントを全て表示するのでなく、一定の範囲で集約した上で、アイコンをまとめて表示する方法（以下、「集約表示」と呼称）である。
集約処理は DB サーバの PostGIS における空間検索にて、メッシュ毎に含まれるデータを図７ 大量データ表示サンプル（16000 件）
これが 10000 件を超えるような件数となった集計することにより実施する。図８に集約表示の概念図を示す。

場合、同等スペックの PC では表示に 10 秒程度の時間を要してしまう。この時間は初回のみであるが、その後の地図操作も重くなり、スマートフォン等の操作を考慮した場合、快適に操作できるとは言い難い状況となる。
常時数千～１万を超えるような件数表示が見込まれる場合、データ表示を高速化する必要が

図８ 集約表示概念図あり、解決策を検討した。

MapAid+Biz では集約表示を実装しており、かつ集約表示を行うか否かの選択を設定にて切６.２ 解決策り替えることができる。

これらの解決を図る場合、現状２とおりの解決策が考えられる。
【解決策①】


以下、集約表示を行った場合の例をMapAid+Biz の画面を用いて説明する。
（図９)

表示が混雑した縮尺では、アイコンを集約表示する。



ある一定の縮尺より拡大した場合は、実データを表示する。

【解決策②】


他の GIS エンジンと組み合わせる

これらの解決策について、以下に説明する。
図９ アイコンを集約表示した場合例− 26 −4/6この例の場合、データ総数は約 59000 点となるが、集約表示ではメッシュ区域ごとに集計し定可能とし、多様なユーザの状況に対応できるようにしている。

た件数のみ読み込んでいるため、取り込むデータ量が少なくて済み、高速に表示することができる。
一方、大縮尺（拡大状態）では、データを個別に表示する。このとき、データベースからは「現在表示中の地図表示エリアに含まれる地物」のみ取得する。
データベースからデータを取得するためのチューニングが必要となるが、一度にサーバか図１１ データ表示実例ら取得し、表示するデータを絞り込むことができるため、ページ表示の負荷を軽くすることができる。

Google Maps Javascript API での地図描画は、ローカルの WEB ブラウザでデータを描画している為、どうしてもサーバからデータを取得する際にボトルネックが生じる。
本節で述べた対応は、一度に読み込むデータ量、頻度を低減することでデータ取得時のボトルネックを解消することを主眼としている。そのため、読み込むデータ量を減らしたにもかかわらず、一度に表示するデータが常時数千件以上になるような場合に関しては、どうしても読み込みに時間が掛かる場面が発生し、快適に使いづらくなる。
これらを解決するためには、解決策②である

図１０ データ取得概念図
また、システムによっては、操作上できる地「他の GIS エンジンと組み合わせる」方式が考えられる。

図縮尺にシステム制限を加え、小縮尺での地図表示を制限している例も見受けられる。
MapAid+Biz では、大縮尺、小縮尺の使い分けを行うことにより、大量データを扱う際の操作感向上に努めている。これらの操作の切り替えに関連する設定値の大部分をパラメータで設− 27 −

5/6

６.２.２. 解決策②

７. まとめ

解決策②は、他の GIS エンジンと組み合わGoogle Map API を用いた地図システムでは、せて高速な地物表示を行う方法である。以下に本稿で取り上げた MapAid+Biz での実現例のと概念図を示す。

おり、その豊富な機能を利用して、地図情報と関連付けられたデータを比較的簡易に多彩な表現で表示することができる。また、大量データを表示する場合、表示が遅くなり操作の快適性が損なわれるが、様々な工夫により大量データでも使用に耐えうる速度で表示することができる。
今後も製品の特徴を生かした製品づくりを心掛けたい。

図１２ 解決策②概念図
GIS エンジンと併用する場合は、GIS サーバ側にて地物描画を行うため、地物情報をローカルにダウンロードする必要が無い。また、描画も高速である。
デメリットとして、高スペックな GIS サー
バ環境の構築が必要となり、導入費用が高額となる点、システムの複雑度、難易度が上がる点が挙げられる。

− 28 −

6/6