MULTISOUP

MULTISOUP

MULTISOUP

Staff Blog

Introduction example

2017.01.12

Roads API を使って道路へスナップする

roadsapi

みなさん、こんにちは!

 

今回は、Google Maps API のウェブサービスのひとつ「Google Maps Roads API」の機能をご紹介いたします!

 

移動中にGPSで取得した位置データを基に、移動経路を地図上に表示したいとき、そのままではGPSの測位誤差によるバラつき等で、移動した道路上を正確に示すことは難しいです。

 

測位した位置をそのまま結んでも、建物の上を通過してしまったり、一部GPSを取得できなかった部分の経路が分からなかったり……

 

Google Maps Roads APIでは、このようなバラつきのあるGPS取得ポイントを、実際に移動していた可能性が高い道路上の地点に「スナップ」してくれる機能を提供します。

 

また、地点と地点の間を「補完」するようなリクエストもでき、これによって実際の移動経路を、道路の形状にあわせてスムーズに表示することが出来るようになります。

 

これから紹介するサンプルでは、皇居の周りを一周するような道路上の移動を想定して、あえて道路からずれた一連の位置情報を用意しました。

この位置情報をもとに、Roads APIを使って道路へのスナップを行い、実際に移動したと想定される経路を表示してみます。

// 道路へのスナップのリクエスト
// (引数originalPathには、元の位置情報の緯度・経度を","で繋げたペアを、
// "|"で繋げたものを渡すこととします)
// (例: "35.690864,139.758896|35.690359,139.759400|35.689461,139.760151")
function requestSnapToRoads(originalPath){
	$.get("https://roads.googleapis.com/v1/snapToRoads", {
		interpolate: true,	// 補完を行うかどうか
		key: roadsApiKey,
		path: originalPath
	}, function(data){
		processResponse(data);
	});
};

 

「interpolate」パラメータはデフォルトでは false であり、地点間の補完は行われません。

(元の位置情報として渡した地点に対してのみ、道路上にスナップされた地点が返されます。)

 

地点間を補完し、道路の形状に合わせたスムーズな経路表示を行うために、ここでは true を指定しています。

// レスポンス処理
function processResponse(data){
	var snappedCoordinates = [];
	for(var i = 0; i < data.snappedPoints.length; i++){
		// スナップされた地点の取得
		var position = new google.maps.LatLng(
			data.snappedPoints[i].location.latitude,
			data.snappedPoints[i].location.longitude);
		snappedCoordinates.push(position);

		// スナップされた地点へのマーカー表示
		var marker = new google.maps.Marker({
			position: position,
			map: map,
			icon: markerImage,
		});

		// 補完された地点(元の位置情報には無かった地点)については、
		// マーカーラベルを"x"として半透明で表示する
		if("originalIndex" in data.snappedPoints[i]){
			marker.setLabel((data.snappedPoints[i].originalIndex+1)+"");
		} else {
			marker.setLabel("x");
			marker.setOpacity(0.5);
		}
	}

	// スナップされた地点をもとにPolylineを表示
	var polyline = new google.maps.Polyline({
		path: snappedCoordinates,
		strokeColor: strokeColor,
		strokeWeight: 3
	});
	polyline.setMap(map);
}

 

レスポンスでは、スナップされた地点の配列が「snappedPoints」として返されます。

各地点の「location」フィールドから、スナップされた地点の緯度と経度を確認できます。

{
	"snappedPoints": [
		{
			"location": {
				"latitude": 35.690866,
				"longitude": 139.75886939999998
			},
			"originalIndex": 0,
			"placeId": "ChIJlasEQg6MGGAR2wLqjbQ_w7I"
		},
		{
			"location": {
				"latitude": 35.6907644,
				"longitude": 139.75884660000003
			},
			"placeId": "ChIJlasEQg6MGGAR2wLqjbQ_w7I"
		},
		(省略)
// スナップされた地点の取得
var position = new google.maps.LatLng(
	data.snappedPoints[i].location.latitude,
	data.snappedPoints[i].location.longitude);

 

レスポンス内の各地点の「originalIndex」フィールドには、リクエストとして渡した元の地点に対応する値が入ります。

リクエスト時に「interpolate」パラメータを true とした場合、地点間の補完がされますが、補完された地点については対応する元の値が無いため、「originalIndex」フィールドもありません。

// 補完された地点(元の位置情報には無かった地点)については、
// マーカーラベルを"x"として半透明で表示する
if("originalIndex" in data.snappedPoints[i]){
	marker.setLabel((data.snappedPoints[i].originalIndex+1)+"");
} else {
	marker.setLabel("x");
	marker.setOpacity(0.5);
}

 

実際のサンプルがこちらです。

Full Screen

 

表示しているマーカーとポリラインは、下記のように区別しています。

また、右上のコントロール部で、経路の表示・非表示を切り替えることが出来ます。

・青: バラつきを持たせた位置情報(元となる地点) ・赤: 補完を行わず、元の地点に対する道路へのスナップ結果のみを繋げた経路 ・橙: 補完を行い、補完された地点も繋げてスムーズに表示した経路

 

Google Maps Roads API の機能により、移動中に取得したGPS位置情報を、正確に視覚化することが出来ます。

 

カーブも滑らかに表示でき、見た目に美しいというのも勿論ですが、

・経路を正確に理解できるようになる ・移動距離を正確に測れるようになる

という点も大きいのではないでしょうか。

 

なお、Google Maps Roads API では、スナップした地点情報をもとに、道路上の制限速度が分かる機能も提供しています。

ただしこちらは、Google Maps API プレミアムプランのライセンスを持っている場合のみ、利用可能となっています。

 

このようにGoogle Maps プレミアムプランでしか使えない機能というのもいくつあるんですよ^^ ぜひプレミアムプランの購入もご検討ください。お問い合わせは、以下のフォームよりお待ちしております。

【関連記事】こんな記事も読まれています

2016.08.26

国土地理院の地図でストリートビューを見る

みなさん、こんにちは!

前回、Googleマップで無償地図の「OpenStreetMap」を表示する方法を説明しましたが、今回は同じような形で・・・

続きを読む

2017.05.26

日光いろは坂で「Roads API」を使ってみたら・・・

みなさん、こんにちは。

先日開催した「Google Maps 活用セミナー」には、多数のご来場ありがとうございました。

 ・・・

続きを読む

2017.10.28

GoogleマップにFusion Tablesを使ってマーカーを7万個描画する

みなさん、こんにちは。

今回は、Google  Fusion Tables にデータを登録し、Google Maps JavaScript A・・・

続きを読む

 - Google Maps APIs, Google Maps JavaScript API, Google Maps Roads API, アセットトラッキング, スタッフ日記, プレミアムプラン, 動態管理

お問い合わせお見積もりから開発のご相談まで、お気軽にお問い合わせください。

Google Maps for Work™に関するご質問やお見積りは、
マルティスープまでお気軽にお問い合わせください03-3518-9013 (受付時間:平日 9:00−18:00)