현재 위치 해발 확보(JavaScript)

나는 브라우저에서 현재 소재지의 해발을 알고 싶다.

눈높이를 알 수 있는 앱도 있지만 오리지널 앱을 만들 수 있다
높은 수치를 얻어야 하기 때문에 조사했습니다.
Geolocation API를 통해 현재 위치 가져오기
Geolocation API는 JavaScript의 API입니다.
위치 정보, IP 주소, WiFi 등의 정보에서 현재 위치를 가져옵니다.
function test() {
    navigator.geolocation.getCurrentPosition(test2);
}
getCurrentPosition()에서 데이터를 성공적으로 가져올 때 매개변수 test2()를 실행합니다.
function test2(position) {
    var lat = position.coords.latitude;
    var lon = position.coords.longitude;
}
테스트 2 () 에서 위도가 가벼운 용기를 준비하여 테스트 () 에서 얻은 데이터를 넣습니다.
위도 경도만 얻으면 이것으로 끝냅니다.
국토지리원 API 사용
국토지리원의 API에 위도가 가볍게 전달되면 해발이 회복된다.
반환된 값은 JSON입니다.
국토지리원 API의 URL
    http://cyberjapandata2.gsi.go.jp/general/dem/scripts/getelevation.php?lon={軽度}&lat={緯度}&outtype=JSON
위도: 36.103543 경도: 140.08531례
반환된 값
반환된 JSON 데이터
    {"elevation":25.3,"hsrc":"5m\uff08\u30ec\u30fc\u30b6\uff09"}
가져온 JSON 데이터 지우기
    var jsonAltitude = JSON.parse(text);
    console.log(jsonAltitude.elevation);
분석 데이터를 팝업으로 표시
//ポップアップ表示
      alert("現在地の標高は" + jsonAltitude.elevation + "mです。" +  "(" + "緯度:" + stringLat + "、経度:" + stringLon + ")")
브라우저의 실행 결과
적당히 〃 형성하다.

해발 가져오기 버튼을 클릭합니다.

다 됐습니다.
모든 코드
fetchAltitude.js
//GeolocationAPが利用できるか確認
if (navigator.geolocation) {
  test()
} else {
  alert("現在地を取得できませんでした。")
}


function test() {
    navigator.geolocation.getCurrentPosition(test2);
}

function test2(position) {

    //まず現在地の緯度経度を取得する
    var lat = position.coords.latitude;
    var lon = position.coords.longitude;

    //国土地理院API用に有効桁数を合わせる。
    var adjustiveLat = lat + "00";
    var adjustiveLon = lon + "0";

    //文字列に変換
    var stringLat = String(adjustiveLat);
    var stringLon = String(adjustiveLon);

    //国土地理院APIに現在地の緯度経度を渡して、標高を取得する
    const url = 'http://cyberjapandata2.gsi.go.jp/general/dem/scripts/getelevation.php?lon=' + stringLon + '&lat=' + stringLat + '&outtype=JSON';

    console.log(url);

    fetch(url).then(function(response) {
      return response.text();
    }).then(function(text) {
      console.log(text);
      
      //取得したjsonをパース
      var jsonAltitude = JSON.parse(text);
      console.log("標高:" + jsonAltitude.elevation + "m");

      //ポップアップ表示
      alert("現在地の標高は" + jsonAltitude.elevation + "mです。" +  "(" + "緯度:" + stringLat + "、経度:" + stringLon + ")")

    });

}

좋은 웹페이지 즐겨찾기