Google Maps APIで住所から緯度と経度を調べる

Google Maps APIで住所を緯度と経度に変換してみます。

サンプルコード

指定した住所を緯度と経度に変換して、その位置にマーカーを立ててみます。

HTML

<div id="map"></div>

JavaScript

var map;
var geocoder;
var marker;
function initMap() {
	map = new google.maps.Map(document.getElementById('map'), {
		center: {lat: 35.712074, lng: 139.79843},
		zoom: 16
	});

	geocoder = new google.maps.Geocoder(); // ジオコードの準備
	geocoder.geocode({ // ジオコードのリクエスト
		'address': '雷門二丁目' // 調べる住所
	}, function(results, status) { // ジオコードのリクエスト結果
		if (status === google.maps.GeocoderStatus.OK) {
			marker = new google.maps.Marker({
				position: results[0].geometry.location,
				map: map
			});
		} else {
			alert('Error: ' + status);
		}
	});
}

住所を緯度と経度に変換するデモページ

new google.maps.Geocoder(); ジオコード(住所変換)のリクエストをGoogleサーバへ送信する準備。
geocode(request:GeocoderRequest, callback:function(Array<GeocoderResult>, GeocoderStatus)) ジオコードのリクエスト。
GeocoderRequestの内容でリクエストを送信して、リクエスト結果とステータスをGeocoderResultとGeocoderStatusに返す。
リクエストはaddress 、location、placeIdのいずれかを必須で指定する。

ジオコードをリクエストした結果(GeocoderResult)は以下のような形で返ってきます。

リクエスト結果

results[]: {
	types[]: string,
	formatted_address: string,
	address_components[]: {
		short_name: string,
		long_name: string,
		postcode_localities[]: string,
		types[]: string
	},
	partial_match: boolean,
	place_id: string,
	postcode_localities[]: string,
	geometry: {
		location: LatLng,
		location_type: GeocoderLocationType
		viewport: LatLngBounds,
		bounds: LatLngBounds
	}
}

 

緯度・経度から住所を調べる

上記とは逆に、緯度・経度から住所を調べてみます。

JavaScript

var map;
var geocoder;
var marker;
var latlng = {lat: 35.7147651, lng: 139.7966553}; // 調べる緯度と経度
var infowindow;
function initMap() {
	map = new google.maps.Map(document.getElementById('map'), {
		center: {lat: 35.712074, lng: 139.79843},
		zoom: 16
	});

	infowindow = new google.maps.InfoWindow;
	geocoder = new google.maps.Geocoder(); // ジオコードの準備
	geocoder.geocode({ // ジオコードのリクエスト
		'location': latlng // 調べる緯度と経度
	}, function(results, status) { // ジオコードのリクエスト結果
		if (status === google.maps.GeocoderStatus.OK) {
			if (results[1]) {
				marker = new google.maps.Marker({
					position: latlng,
					map: map
				});
				infowindow.setContent(results[1].formatted_address);
				infowindow.open(map, marker);
			} else {
				alert('No results found');
			}
		} else {
			alert('Error: ' + status);
		}
	});
}

緯度・経度から住所を調べるデモページ
今回はresults[1].formatted_addressで住所を取得して、infowindowで表示しています。
resultsは複数返ってくることがほとんどで、今回の場合はそれぞれ以下のように格納されています。

results[0].formatted_address // 日本, 〒111-0032 東京都台東区浅草2丁目3−1
results[1].formatted_address // 日本, 〒111-0032 東京都台東区浅草2丁目3
results[2].formatted_address // 日本, 〒111-0032 東京都台東区浅草2丁目
results[3].formatted_address // 日本, 〒111-0032 東京都台東区浅草
results[4].formatted_address // 日本, 東京都台東区
results[5].formatted_address // 日本 東京
results[6].formatted_address // 日本

 

この他にもPlace IDから住所を調べる方法などありますが、あまり使う場面がなさそうな気がするので今回は割愛します。
各オプションについてはGeocoderRequestのオプションGeocoderResultのオプションGeocoderStatusのオプションなどでご確認ください。
 

【参考サイト】

 

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2024年2月
 123
45678910
11121314151617
18192021222324
2526272829