PHPで位置情報を取得してGoogleMapAPIで使用する方法

GPSみたいな位置情報をPHPで取得し、GoogleMapAPIでその場所を反映させたかった。調べてみるとHTML5のGeolocation APIというものが使えそう。

■対応ブラウザ

IE9～ / FireFox3.5～ / GoogleChrome 5～ / Safari 5～

■取得のみのコード

var ret = new Array();
if( navigator.geolocation ){
	navigator.geolocation.getCurrentPosition(
		function( pos ){ //位置取得成功
			ret['long'] = pos.coords.longitude; //経度
			ret['lat'] = pos.coords.latitude; //緯度
			result( ret );
		},
		function( error ){ //失敗
			switch( error.code ){
				case 1: ret['msg'] = "位置情報の利用が許可されていません"; break;
				case 2: ret['msg'] = "デバイスの位置が判定できません"; break;
				case 3: ret['msg'] = "タイムアウトしました"; break;
			}
			result( ret );
		}
	);
} else { //使用不可のブラウザ
	ret['msg'] = 'このブラウザでは位置取得が出来ません。';
	result( ret );
}
function result( ret ){
	console.log( ret );
}

以下にGoogleMapAPIに反映させるサンプルとソース。

■サンプル

http://sample.taitan916.info/geolocation/

■ソース

	//サンプルで東京タワーを表示
	var currentWindow = null;
	var sample = { 'x':'35.65858', 'y':'139.745433', 'balloon':'東京タワー' };
	var latlng = new google.maps.LatLng(sample.x, sample.y);
	var myOptions = { zoom: 7, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP };
	var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	makeMarker(sample);


	//現在位置の取得
	if (navigator.geolocation) {
		navigator.geolocation.getCurrentPosition(
		function (pos) { 
			var mapData = { 'x':pos.coords.latitude, 'y':pos.coords.longitude, 'balloon':'現在位置' };
			makeMarker( mapData );
		},
		function (error) {
			var msg;
			switch( error.code ){
				case 1: msg = "位置情報の利用が許可されていません"; break;
				case 2: msg = "位置が判定できません"; break;
				case 3: msg = "タイムアウトしました"; break;
			}
			alert(msg);
		});
	} else {
		alert("本ブラウザではGeolocationが使えません");
	}

	//マーカー作成
	function makeMarker( mapData ){
		var marker = new google.maps.Marker({
			position : new google.maps.LatLng(mapData.x,mapData.y), 
			map: map
		});

		var infoWindow = new google.maps.InfoWindow();
		google.maps.event.addListener(marker, 'click', function() {
			if (currentWindow) {
				currentWindow.close();
			}
			infoWindow.setContent(mapData.balloon);
			infoWindow.open(map,marker);
			currentWindow = infoWindow;
		});
	}

■その他

ブラウザによってリロードのたびに許可を求められるものと求められないものがあった。一度取得したものは10分ぐらいキャッシュさせとくのが良いかも。