>  기사  >  웹 프론트엔드  >  지리적 위치_html5 튜토리얼 기술을 얻기 위한 간단한 html5 코드

지리적 위치_html5 튜토리얼 기술을 얻기 위한 간단한 html5 코드

WBOY
WBOY원래의
2016-05-16 15:48:181366검색


코드 복사
코드는 다음과 같습니다.

/**
* 다음은 지리적 위치를 얻기 위한 html5 코드입니다
*/
function getLocation() {
//브라우저가 위치정보 획득을 지원하는지 확인
if (navigator.geolocation) {
//위치정보 획득을 지원하는 경우 showPosition(을 성공적으로 호출합니다. ), showError 호출 실패
// Alert("위치를 가져오는 중...");
var config = { 활성화HighAccuracy: true, timeout: 5000, maximumAge: 30000 }
navigator.geolocation .getCurrentPosition( showPosition, showError, config);
} else {
//alert("이 브라우저에서는 위치 정보를 지원하지 않습니다.")
alert("위치 지정에 실패했습니다. 사용자가 위치 획득을 비활성화했습니다. 허가");
}
}
/**
* 주소 위치를 성공적으로 획득했습니다
*/
function showPosition(position) {
//경도와 위도를 가져옵니다
var x = position. coords.latitude;
var y = position.coords.longitude;
//Baidu 지오코딩 API 구성
var url = "http://api.map.baidu.com/geocoder/v2/?ak =C93b5178d7a8ebdb830b9b557abce78b"
"&callback=renderReverse"
"&location=" x "," y
"&output=json"
"&pois=0";
$.ajax({
type: "GET" ,
dataType: "jsonp",
url: url,
success: function (json) {
if (json == null || typeof (json) == "정의되지 않음") {
return;
}
if (json.status != "0") {
return;
}
setAddress(json.result.addressComponent);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("[x:" x ",y:" y "]주소 위치를 가져오지 못했습니다. 주소를 수동으로 선택하세요. ");
}
});
}
/**
* 주소 위치 획득 실패 [아직 처리되지 않음]
*/
function showError(error) {
스위치(error.code) {
case error.PERMISSION_DENIED:
alert("위치 지정 실패, 사용자가 위치정보 요청을 거부했습니다.")
//x.innerHTML = "사용자가 위치정보 요청을 거부했습니다.[사용자가 위치정보 요청을 거부했습니다.] "
break;
case error.POSITION_UNAVAILABLE :
alert("위치 정보를 사용할 수 없습니다. 위치 정보를 사용할 수 없습니다.");
//x.innerHTML = "위치 정보를 사용할 수 없습니다.[위치 정보를 사용할 수 없습니다. ]"
break;
case error.TIMEOUT:
alert("위치 확인 실패, 사용자 위치 가져오기 요청 시간이 초과되었습니다.");
//x.innerHTML = "사용자 위치 가져오기 요청입니다. 시간이 초과되었습니다.[사용자 위치 가져오기 요청 시간이 초과되었습니다.]"
break;
case error.UNKNOWN_ERROR:
alert("Positioning failed, positioning system failed");
//x.innerHTML = "알 수 없는 오류가 발생했습니다.[알 수 없는 오류]"
break
}
}
/**
* 주소 설정
*/
function setAddress(json) {
var position = document.getElementById("txtPosition");
//지방
var 지방 = json.province;
//City
var city =
//District
var 지역 = json.district;
지방 = 지방.replace('도시', '');
위치.값 = 지방 "," 도시 "," 지역
위치.스타일.색상 = '검은색';
}
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.