HTML5의 geopositioning
HTML5 위치 정보 (geopositioning)는 사용자의 위치를 찾는 데 사용.
사용자의 위치를 찾습니다
HTML5 위치 정보 API는 사용자의 위치를 얻을 수 있습니다.
사용자가 동의 그렇지 않으면, 사용자의 프라이버시를 침해 할 수있다이 기능의 관점에서, 사용자 위치 정보를 사용할 수 없습니다.
브라우저 지원
인터넷 익스플로러 9 이상, 파이어 폭스, 크롬, 사파리와 오페라 지원 위치 정보 (지리적 위치).
참고 사항 : 아이폰,보다 정확한 geopositioning으로 GPS와 장치에 대한 위치 정보 (geopositioning을).
HTML5 - 사용 지역 타겟팅
사용자의 위치를 얻을 수 getCurrentPosition () 메서드를 사용합니다.
다음 예는 단순한 지리적 위치 인스턴스, 사용자는 위치의 위도와 경도로 돌아갈 수 있습니다 :
예
함수의 getLocation ()
{
경우 (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition (showPosition);
}
그렇지 않으면
{
x.innerHTML = "이 브라우저가 위치를 얻기 지원하지 않습니다.";
}
}
기능 showPosition (위치)
{
x.innerHTML = "위도 :"+ position.coords.latitude +
"경도로 <br> :"+ position.coords.longitude을;
}
»시도
분석의 예 :
- 그것은 geopositioning 시험을 할 때
- 지원되는 경우, getCurrentPosition () 메소드를 실행합니다. 그렇지 않으면, 사용자에게 메시지를 표시한다.
- getCurrentPosition ()가 성공하면 함수는 showPosition 대상 좌표에 지정된 매개 변수를 반환
- showPosition () 함수를 검색하여 위도 및 경도를 표시
위의 예는 매우 기본적인 geopositioning 스크립트 오류없이 처리합니다.
오류 처리 및 거부
오류를 처리하기위한 두 번째 매개 변수의 getCurrentPosition () 메소드. 그것은 사용자의 위치가 실패했을 때 get 함수를 실행할 때 지정
예
{
스위치 (error.code)
{
경우 error.PERMISSION_DENIED :
x.innerHTML는 = "사용자가 위치 요청을받을 것을 거절했다."
휴식;
경우 error.POSITION_UNAVAILABLE :
x.innerHTML = "위치 정보를 사용할 수 없습니다."
휴식;
경우 error.TIMEOUT :
x.innerHTML = "요청 사용자 위치 시간이 초과되었습니다."
휴식;
케이스 error.UNKNOWN_ERROR :
x.innerHTML는 = "알 수없는 오류가 발생했습니다."
휴식;
}
}
»시도
오류 코드 :
- 권한이 거부 - 사용자가 geopositioning을 사용할 수 없습니다
- 사용할 수없는 위치 - 현재 위치를 가져올 수 없습니다
- 제한 시간 - 작업 시간이 초과되었습니다
지도에서 결과 표시
지도에 결과를 표시하려면, 당신은 위도와 구글지도 또는 바이두지도 등지도 서비스의 경도를 사용하여 액세스해야 :
예
{
var에 latlon = position.coords.latitude + ","+ position.coords.longitude;
var에 img_url = "http://maps.googleapis.com/maps/api/staticmap?center="
+ Latlon + "& 줌 = 14 크기 = 400x300 & 센서 = 거짓";
중요 document.getElementById ( "mapholder") innerHTML을 = "<IMG SRC = '"+ img_url + "'>";
}
»시도
위의 예에서 우리는 구글지도에서 (정적 이미지를 사용하여) 표시 위치에 의해 반환 위도와 경도 데이터를 사용합니다.
Google지도 스크립트
위의 링크는 어떻게 마커, 줌 및 드래그 옵션을 사용하여 대화 형지도를 표시하는 스크립트를 사용하는 방법을 보여줍니다.
정보 지정된 위치에
이 페이지는지도에 사용자의 위치를 표시하는 방법을 보여줍니다. 주어진 위치 그러나 지리적 위치 정보는 매우 유용합니다.
예 :
- 지역 정보를 업데이트
- 사용자 주변의 관심의 표시 점
- 인터랙티브 차량 항법 시스템 (GPS)
getCurrentPosition () 메소드 - 반환 데이터
T가 성공하면, getCurrentPosition () 메서드는 개체를 반환합니다. 항상 위도, 경도 및 정확성 속성을 반환합니다. 가능한 경우, 다음과 같은 추가 속성이 반환됩니다.
| 属性 | 描述 |
|---|---|
| coords.latitude | 十进制数的纬度 |
| coords.longitude | 十进制数的经度 |
| coords.accuracy | 位置精度 |
| coords.altitude | 海拔，海平面以上以米计 |
| coords.altitudeAccuracy | 位置的海拔精度 |
| coords.heading | 方向，从正北开始以度计 |
| coords.speed | 速度，以米/每秒计 |
| timestamp | 响应的日期/时间 |
위치 정보 객체 - 다른 흥미로운 방법
watchPosition은 () - 사용자의 현재 위치를 반환하고, (차에 GPS 같은) 업데이트 된 위치를 반환 할 때 사용자의 움직임을 계속합니다.
clearWatch () - 정지 watchPosition () 메소드
다음의 예는 watchPosition () 메소드를 보여줍니다. 당신은 (예 : 아이폰 등)의 경우를 테스트하기 위해 정확한 GPS 장치가 필요합니다 :
예
함수의 getLocation ()
{
경우 (navigator.geolocation)
{
navigator.geolocation.watchPosition (showPosition);
}
그렇지 않으면
{
x.innerHTML = "이 브라우저가 위치를 얻기 지원하지 않습니다.";
}
}
기능 showPosition (위치)
{
x.innerHTML = "위도 :"+ position.coords.latitude +
"경도로 <br> :"+ position.coords.longitude을;
}
»시도