[자바스크립트] 날씨 정보 가져오기, Geolocation API
반응형
날씨 추가하기, geolocation API
- geolocation API는 사용자의 현재 위치 정보를 가져올 때 사용하는 자바스크립트 API이다.
- 사용자의 위치를 지도에 표시하거나, 사용자 근처의 상점을 찾아주는 등의 위치기반 서비스를 할 수 있다.
- 그러나 이러한 정보는 사용자의 동의를 꼭 구하고 사용해야 한다.
Geolocation.getCurrentPosition()
- 장치의 현재 위치를 가져오는 메소드이다.
기본 문법
navigator.geolocation.getCurrentPosition(success[, error[, [options]])- success 함수는 GeolocationPosition 객체를 유일한 매개변수로 받는 콜백 함수이다.
Geolocation API 메소드
| Method | 설명 |
| getCurrentPosition() | 사용자의 현재 위치를 가져옴. |
| watchPosition() | 사용자의 현재 위치를 가져오고 나서, 사용자의 움직임에 따라 지속적으로 위치 정보를 갱신함. |
| clearWatch() | watchPosition() 메소드의 실행을 중지함. |
getCurrentPosition() 메소드의 반환 값
| 속성 | 반환값 |
| coords.latitude | 소수로 표현된 위도 값 |
| coords.longitude | 소수로 표현된 경도 값 |
| coords.accuracy | 위도 값과 경도 값의 정확도 |
| coords.altitude | 평균 해수면을 기준으로 하는 고도 값(해발) |
| coords.altitudeAccuracy | 고도 값의 정확도 |
| coords.heading | 북쪽을 기준으로 현재 진행 방향에 대한 시계방향으로의 각도 값(˚) |
| coords.speed | 초당 이동한 미터 수를 나타내는 속도 값(초속) |
| timestamp | 위치 정보를 가져온 시간을 나타냄. |
Weather API 이용하기
- https://openweathermap.org/
- 계정 생성 > Current Weather Data > API doc > By geographic coordinates
function example(position) {
const lat = position.coords.latitude;
const lon = position.coords.longitude;
const url = `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lon}&appid=${API_KEY}`
console.log(url)
fetch코드...
}
📌 참고
반응형
'프로그래밍 > JavaScript' 카테고리의 다른 글
| [자바스크립트] 변수의 유효범위와 클로저 (0) | 2021.07.10 |
|---|---|
| [자바스크립트] Array.from(), 배열로 만들어주기 (0) | 2021.07.10 |
| [자바스크립트] 노드의 관리, appendChild(), createElement(), createAttribute() 등 (0) | 2021.07.08 |
| [자바스크립트] milliSeconds를 시/분/초로 변환하는 법 (2) | 2021.07.07 |
| [자바스크립트] Date 객체 (0) | 2021.07.06 |