HTML5 地理位置情報

HTML5 Geolocation API は、ユーザーの地理的位置を取得するために使用されます。

注: この機能はユーザーのプライバシーを侵害する可能性があるため、ユーザーが同意しない限り、ユーザーの位置情報は利用できません。この機能を使用すると、ブラウザーにリマインダーボックスが表示されます。

1. 地理位置情報のいくつかの方法

IP アドレス、GPS、Wifi、GSM/CDMA

2. 地理位置情報の取得プロセス

1ユーザーが Web アプリケーションを開きます。地理的な位置を取得する必要があります。

2. アプリケーションはブラウザーに地理的位置を要求し、ブラウザーは地理的位置を共有するかどうかをユーザーに尋ねるクエリをポップアップ表示します。

3. ユーザーが許可すると、ブラウザはデバイスから関連情報をクエリします。

4. ブラウザーは関連情報を信頼できる位置サーバーに送信し、サーバーは特定の地理的位置を返します。

3. ブラウザのサポート

IE9.0+、FF3.5+、Safari5.0+、Chrome5.0+、Opera10.6+は地理位置情報をサポートします。

注: iPhone (iPhone3.0+、Android2.0+) などの GPS を搭載したデバイスの場合、地理的位置はより正確です。 html5のジオロケーションメソッドは、ナビゲーターオブジェクトに存在し、getCurrentposition //現在の位置

3 .clearWatch //監視をクリアします

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
<p id="demo">点击按钮获取您当前坐标（可能需要比较长的时间获取）：</p>
<button onclick="getLocation()">点我</button>
<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition);
    }
  else{x.innerHTML="该浏览器不支持获取地理位置。";}
  }
function showPosition(position)
  {
  x.innerHTML="纬度: " + position.coords.latitude + 
  "<br>经度: " + position.coords.longitude;
  }
</script>
</body>
</html>

インスタンス分析:

地理位置情報がサポートされているかどうかを検出します

サポートされている場合は、getCurrentPosition()メソッドを実行します。サポートされていない場合は、ユーザーにメッセージが表示されます。
getCurrentPosition() が正常に実行されると、パラメーター showPosition で指定された関数に座標オブジェクトが返されます

showPosition() 関数は経度と緯度を取得して表示します

エラーと拒否を処理します

getCurrentPosition( ) メソッドエラーを処理するために使用されます。ユーザーの位置情報の取得に失敗したときに実行する関数を指定します:

function showError(error)
{
switch(error.code)
{
case error.PERMISSION_DENIED:

case error.POSITION_UNAVAILABLE:
x.innerHTML="位置情報が利用できません。"ブレーク
ケースエラー.TIMEOUT:
WN_ERROR:
x.innerHTML=" 不明なエラー "a Break;
}}

Getcurrentposition () メソッド - データを返す

位置が成功した場合、getCurrentPosition() メソッドオブジェクトを返します。緯度、経度、精度のプロパティは常に返されます。利用可能な場合は、次の他のプロパティが返されます。 10 進数としての経度 coords.accuracy 位置精度

coords.altitude 標高、海抜メートル単位計算

coords.altitudeAccuracy 場所の高度精度
coords.Heading 方向、true からの度単位北

coords.speed 速度 (メートル/秒) timestamp 応答日時

Alright 地理的位置を取得 (Firefox でのみサポート)

p.address.country country

p.住所.地域都道府県

p.住所.市市

学び続ける

新しいファイル

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>基于浏览器的HTML5查找地理位置</title>  <script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script> <script> function getLocation(){ var options={ enableHighAccuracy:true, maximumAge:1000 } if(navigator.geolocation){ //浏览器支持geolocation navigator.geolocation.getCurrentPosition(onSuccess,onError,options); }else{ //浏览器不支持geolocation } } //成功时 function onSuccess(position){ //返回用户位置 //经度 var longitude =position.coords.longitude; //纬度 var latitude = position.coords.latitude; //使用百度地图API //创建地图实例 var map =new BMap.Map("container"); //创建一个坐标 var point =new BMap.Point(longitude,latitude); //地图初始化，设置中心点坐标和地图级别 map.centerAndZoom(point,15); } //失败时 function onError(error){ switch(error.code){ case 1: alert("位置服务被拒绝"); break; case 2: alert("暂时获取不到位置信息"); break; case 3: alert("获取信息超时"); break; case 4: alert("未知错误"); break; } } window.onload=getLocation; </script> </head> <body>  <div id="container" style="width:600px;height:600px"></div> </body> </html>

提出するリセットコード

自動運転