집 >
웹 프론트엔드 >
H5 튜토리얼 >
지리적 위치_html5 튜토리얼 기술을 얻기 위한 간단한 html5 코드
지리적 위치_html5 튜토리얼 기술을 얻기 위한 간단한 html5 코드
WBOY
풀어 주다: 2016-05-16 15:48:18
원래의
1399명이 탐색했습니다.
코드 복사
코드는 다음과 같습니다.
/** * 다음은 지리적 위치를 얻기 위한 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('도시', ''); 위치.값 = 지방 "," 도시 "," 지역 위치.스타일.색상 = '검은색'; }