Google Maps API 지오코드 설명[2022]

이 튜토리얼을 마치면 HTTP 인터페이스와 JavaScript SDK를 사용하여 Google Maps Geocoding API를 사용하는 방법을 더 잘 이해할 수 있습니다.
  • What is Google Geocoding API
  • How To Enable Geocoding API
  • Convert Address To Latitude & Longitude
  • Convert Latitude & Longitude To Address
  • Geocoder Using JavaScript SDK
  • Geocode API Price

  • Google 지오코딩 API



    지오코딩 API는 Google Maps API 생태계에서 제공하는 많은 서비스 중 하나입니다.

    지오코딩은 사람이 읽을 수 있는 실제 주소를 지리적 좌표(위도 및 경도 값)로 변환하는 프로세스입니다.

    매우 일반적인 용도 중 하나는 웹사이트의 Google 지도에 업체 위치를 표시하려는 경우입니다.

    Geocoding API를 사용하려면 다음 두 가지 작업을 수행해야 합니다.
  • Get An API Key
  • Enable Geocoding Library

  • 지오코딩 API 활성화



    Google Cloud Platform 콘솔에서 API 및 서비스 → 대시보드 → 상단의 API 및 서비스 활성화로 이동하고 API 라이브러리에서 Maps JavaScript API를 선택합니다.

    이렇게 하면 Maps JavaScript API 페이지가 열리고 활성화됩니다.



    그런 다음 "탐색할 솔루션 더 보기"까지 아래로 스크롤하고 Geocoding API → 활성화를 선택합니다.



    주소를 위도 및 경도로 변환



    앞에서 언급한 지오코딩(Geocoding)이라고 하는 위도와 경도 형태의 지리적 좌표로 실제 주소를 변환해 봅시다.

    경우에 따라 CORS error이 표시될 수 있으며 heroku와 같은 프록시 서버 URL을 추가하여 수정할 수 있습니다.

    const address = "111 Wellington St, Ottawa, ON K1A 0A9, Canada";
    
    fetch(`https://maps.googleapis.com/maps/api/geocode/json?address=${address}&key=[YOUR_API_KEY]`)
    .then((response) => {
        return response.json();
    }).then(jsonData => {
        console.log(jsonData.results[0].geometry.location); // {lat: 45.425152, lng: -75.6998028}
    })
    .catch(error => {
        console.log(error);
    })
    


    위도 및 경도 값에 액세스하면 Create a Google Maps objectPlace/Position the address on the map using Marker을 사용할 수 있습니다.

    주소를 위도 및 경도로 변환



    위도 및 경도 값을 거리 주소로 변환하는 방법을 살펴보겠습니다. 이 프로세스를 역 지오코딩이라고 합니다.

    const latLng = "45.425507, -75.700233";
    
    fetch(`https://maps.googleapis.com/maps/api/geocode/json?latlng=${latLng}&key=[YOUR_API_KEY]`)
    
    .then((responseText) => {
        return responseText.json();
    })
    .then(jsonData => {
        console.log(jsonData.results[0].formatted_address); //111 Wellington St, Ottawa, ON K1A 0A9, Canada
    })
    .catch(error => {
        console.log(error);
    
    })
    


    브라우저에서 detect a user’s current location 거리 주소로 변환하려는 경우에 유용한 옵션입니다.

    JavaScript SDK를 사용하는 지오코더



    API URL을 직접 사용하는 대신 Geocoder를 사용하는 JavaScript SDK를 통해 Google Maps Geocoding API 서비스를 사용할 수도 있습니다.

    이렇게 하려면 JavaScript SDK CDN을 index.html 파일에 추가하십시오.

    add your own API Key을 확인하십시오.

    <script src="https://maps.googleapis.com/maps/api/js?key=[YOUR_API_KEY]&callback=initialize" async defer></script>
    


    JavaScript SDK가 브라우저에 로드되는 즉시 초기화 함수가 호출됩니다.

    초기화 함수 내에서 Geocoder 개체를 사용하여 거리 주소를 위도 및 경도 값으로 변환합니다.

    const address = "111 Wellington St, Ottawa, ON K1A 0A9, Canada";
    
    function initialize() {
    
        geocoder = new google.maps.Geocoder();
    
        geocoder.geocode({
            address: address
        }, (results, status) => {
            if (status == google.maps.GeocoderStatus.OK) {
                console.log(results[0].geometry.location.lat());
                console.log(results[0].geometry.location.lng());
            } else {
                alert('Geocode was not successful for the following reason: ' + status);
            }
        });
    
    }
    


    위의 요청과 유사하게 위도 및 경도 값을 역지오코딩(Reverse Geocoding)이라는 거리 주소로 변환하기 위해 동일한 작업을 수행할 수도 있습니다.

    Google Geocode API 가격



    Creating your own API Key 시점에 결제를 설정하면 이 튜토리얼을 작성하는 시점에 일회성$300 FREE credit 및 매월 반복 $200 무료 크레딧이 제공됩니다.

    Google은 지오코딩 요청당 $0.005를 청구하며 충분한 무료 $200 크레딧으로 매달 40,000개의 지오코딩 API 요청을 할 수 있습니다.

    결론
    지오코딩과 역지오코딩이 무엇인지, Google Maps Geocoding API를 사용하여 주소를 위도 및 경도 값으로 또는 그 반대로 변환하는 방법을 배웠습니다.

    또한 Geocoding API URL을 직접 사용하거나 Geocoder를 사용하는 Google Maps Geocoding JavaScript SDK를 사용하는 Google Maps Geocoding API에 액세스하는 두 가지 다른 방법도 보여 드렸습니다.

    질문이나 제안이 있거나 이 튜토리얼에 추가하고 싶은 것이 있으면 아래에 댓글을 달아 저에게 빠른 메시지를 보내주세요.

    행복한 코딩.

    좋은 웹페이지 즐겨찾기