HTML5 위치정보

HTML5 Geolocation API는 사용자의 지리적 위치를 얻는 데 사용됩니다.

참고: 이 기능은 사용자의 개인 정보를 침해할 수 있으므로 사용자가 동의하지 않으면 사용자의 위치 정보를 사용할 수 없습니다. 이 기능을 사용할 때.

여러 가지 지리적 위치 지정 방법

IP 주소, GPS, Wifi, GSM/CDMA

2. 지리적 위치 획득 프로세스

1. 신청서를 받아야 합니다.

2. 애플리케이션이 브라우저에 지리적 위치를 요청하고, 브라우저는 사용자에게 지리적 위치를 공유할지 묻는 쿼리를 표시합니다.

3. 사용자가 허용한다고 가정하면 브라우저는 기기에서 관련 정보를 쿼리합니다.

4. 브라우저는 신뢰할 수 있는 위치 서버에 관련 정보를 보내고 서버는 특정 지리적 위치를 반환합니다.

3. 브라우저 지원

IE9.0+, FF3.5+, Safari5.0+, Chrome5.0+, Opera10.6 + 지원 지리적 위치.

참고: iPhone(IPhone3.0+, Android2.0+)과 같이 GPS가 있는 기기의 경우 위치정보가 더 정확합니다.

4. HTML5의 Geolocation 메소드

Geolocation API는 navigator 객체에 존재하며 3가지 메소드만 포함합니다:

1. getCurrentPosition //현재 위치

2. watchPosition //모니터링 위치

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)
요청. "
break;
케이스 error.POSITION_UNAVAILABLE:
x.innerHTML= "위치 정보를 사용할 수 없습니다. 케이스 오류.TIMEOUT:
x .innerHTML="사용자 위치 요청 시간이 초과되었습니다."
> getCurrentPosition() 메소드 - 데이터 반환

위치를 성공적으로 획득한 경우 getCurrentPosition() 메소드는 객체를 반환합니다. 위도, 경도 및 정확도 속성은 항상 반환됩니다. 사용 가능한 경우 다른 다음 속성이 반환됩니다.

속성 시스템 번호의 위도

coords.longitude 십진수 경도 coords.accuracy 위치 정확도
좌표. 고도 해발 고도(미터)

coords.altitudeAccuracy 위치 정확도 고도 정확도 coords.heading 진북 방향(도)

coords.speed 속도(미터) /초

timestamp 응답 날짜/시간 지리적 위치도 확인할 수 있습니다(firefox에서만 지원)

p.address.country 국가

p.address.region 주

p.address.city 시

지속적인 학습

새로운 파일

<!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>

제출하다 코드 재설정

자동운전