GoogleMapSample10:ポリィラインのエンコード

ポリィラインなのかポリーラインなのか未だに読み方が分からない件。
複雑なポイント設定のあるラインを地図に引きたい場合はこちらが最適。
公式サイトにあるInteractive Polyline Encoder Utilityにて、ラインのエンコードが出来ます。


window.onload = function() {
  
  if (GBrowserIsCompatible()) {
	var map = new GMap(document.getElementById("map"));
	
	map.setCenter(new GLatLng(35.684559540915416,139.75871086120605), 14);
	var encodedPolyline = new GPolyline.fromEncoded({
		color: "#00FF00",
		weight: 10,
		points: "__xxEseatYsDd[eRkDsAjKuGuAqO|E_F`V",
		levels: "BBBBBBB",
		zoomFactor: 32,
		numLevels: 4
	});
	map.addOverlay(encodedPolyline);
  }
}

map.setCenter(new GLatLng(35.684559540915416,139.75871086120605), 14);
地図の中心と拡大率設定。変数にしても良い。

var encodedPolyline = new GPolyline.fromEncoded
ポリィラインオブジェクト作成。エンコードしてますぜ、というオプションをつける

color:
ラインの色

weight:
ラインの太さ

points:
エンコードツールで書き出されたコードをコピペする

levels:
エンコードツールで書き出されたレベルをコピペする。
マップレベルとラインレベルで文字が決まってるらしい。

zoomFactor:とnumLevels:
線の描画精度を司るらしいが、Googleの説明が不親切すぎてイマイチよく分からない…。

海外のサイトで検証してるところがあったので参考に。

参考:Encoding polylines for Google Maps

Leave a Comment.