サンプル：
http://html5next.appspot.com/geolocation1.html
ソース：
<script type="text/javascript">
function formload()
{
try
{
if(navigator.geolocation)
{
document.getElementById("status").innerHTML = "あなたのブラウザーはHTML5 Geolocationをサポートしています。<br/>位置情報サービスの利用許可をいただいたら、しばらくお待ちください。";
navigator.geolocation.getCurrentPosition(updateLocation);
}
else
{
document.getElementById("status").innerHTML = "あなたのブラウザーはHTML5 Geolocationをサポートしていません。";
}
}
catch(e)
{
alert(e.description);
}
}
function updateLocation(position)
{
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var accuracy = position.coords.accuracy;
var timestamp = position.timestamp;
var date = new Date(timestamp);
document.getElementById("position").innerHTML = ""
+ "緯度：" + latitude + "<br/>"
+ "経度：" + longitude + "<br/>"
+ "精度：" + accuracy + "<br/>"
+ "時間：" + date + "<br/>"
;
var src = 'http://maps.google.com/staticmap?center=' + latitude + ',' + longitude + '&zoom=14&size=480x320&markers=' + latitude + ',' + longitude;
$('#imgPos').attr('src', src);
}
</script>
<body onload="formload();">
<div id="status"></div>
<div id="position"></div>
<img id="imgPos" />
</body>
エラー処理関数：
function handleLocationError(error)
{
switch(error.code)
{
case 0:
// error.message : ロケーション取得エラー
break;
case 1:
// error.message : ユーザーキャンセル
break;
case 2:
// error.message : ブラウザーはロケーション情報を取得できない
updateStatus("The browser was unable to determine your location: " + error.message);
break;
case 3:
// error.message : ロケーション情報取得タイムアウト
break;
}
}
0 件のコメント:
コメントを投稿