이 문서에서는 Nearby Search (신규) API 를 사용하여 간단하고 비용 효율적인
지역 검색 환경입니다.
지역 검색 환경은 호텔이나 부동산을 검색할 때 지정한 위치 근처의 주요 관심 장소를 사용자에게 보여줍니다. 대체로 대화형 지도로 구성되며 여기에는 장소 선택기 및 사진 갤러리가 포함된 추가 패널이 있습니다. 상호작용 환경을 개선할 수 있는 다양한 Google Maps Platform 제품 및 기능이 제공됩니다.
사용 사례
이제 로컬 검색 통합에서 사용자 가치를 창출하는 요소가 무엇인지 알아보겠습니다.
탐색 - 다양한 유형의 관련 장소를 표시하여 사용자에게 단일 위치 주변의 개요를 제공합니다.
상호작용 - 사용자가 장소를 선택하고 데이터를 동적으로 새로고침할 수 있습니다.
표시됩니다.
시각화 - 장소 리뷰, 사진 제공
도보 시간과 거리를 계산하여 사용자가 자신의 니즈에 부합하는지 빠르게 파악할 수 있습니다
참조 아키텍처
로컬 검색
지역 검색 환경을 만드는 방법에는 여러 가지가 있습니다. 다음 통합은 잘 알려진 Google Maps Platform API와 몇 가지 흥미로운 새 기능을 활용하는 사용자 환경의 맞춤 예입니다. 로컬 검색에 템플릿화된 접근 방식을 취하고자 하는 경우 웹 구성요소를 사용할 수 있습니다.
샘플 애플리케이션
샘플 둘러보기
아래 표에는 Google Maps Platform API를 사용한 기술적 구현에 대한 설명과 함께 단계별로 구분된 샘플 애플리케이션이 나와 있습니다.
1. AutocompleteSearch 위치를 사용한 위치 검색
- Maps JavaScript API를 로드합니다.
- Place Autocomplete 쿼리하거나 지도에서 위치를 선택합니다.
2. Nearby Search (New) API를 사용하여 지역 관심 장소를 표시
- 인기도 순위 (관련성이 더 높은 검색결과) 또는 거리 순위
includedTypes,excludedTypes: 호텔의 경우 '숙박 시설' 유형을 제외하고 '레스토랑, 카페, 공원, 투어리트_트트랙'과 같은 적절한 유형만 포함할 수 있습니다.includedPrimaryTypes,excludedPrimaryTypes를 활용하면 결과를 더 세밀하게 제어할 수 있습니다.- `locationRestriction은 결과 수가 충분하지 않거나 장소가 너무 멀어지지 않도록 합니다. 결과가 0인 경우 결과를 표시하기 전에 원 / 직사각형 크기를 넓힙니다.
데이터 필드가 요청된 호텔을 예약하는 경우의 쿼리 샘플:
- 기본 (
displayName,types,openingHours,formattedAddress) - 연락처 (
websiteUri,nationalPhoneNumber,internationalPhoneNumber) - 선호 (
reviews,priceLevel,userRatingCount)
{ "includedTypes": ["restaurant","cafe","park"], "excludedTypes":
["lodging","convenience_store"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
요청된 데이터 필드로 부동산을 검색하는 경우의 쿼리 샘플:
- 기본 (
displayName,types,openingHours,formattedAddress)
{ "includedTypes": ["school","transport","bus","convenience_store"],
"excludedTypes": ["lodging"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
3. Dynamic Maps 및 Directions API로 상호작용 추가하기
- Directions API를 쿼리하여 최신 구간 및 단계 * 다음 섹션의 시간을 사용하세요.
4. 상호작용 시 장소의 세부정보 표시
설명:
displayName,types,rating,userRatingCount,priceLevel.시간: 이전 Directions API 쿼리에서 가져옵니다.
리뷰:
reviews[i].author,reviews[i].rating,reviews[i].text.이미지: Nearby Search (New) API의 무제한 미리보기 중에
place.id로 장소 세부정보를 쿼리하여 photo_reference를 가져온 다음 환경에서 한 번에 하나씩 쿼리해야 합니다.
쿼리 수 및 관련 비용
- Maps JavaScript API: 환경 로드 시 지도 1개.
- Places Autocomplete API: 입력된 모든 문자를 쿼리하는 1회 실행 (자동 완성 위젯을 사용하는 경우) 맞춤설정할 수 있습니다.
- Nearby Search (신규) API: 장소 20곳마다 쿼리 1개 쿼리 응답에 포함된 장소 데이터에 따라 다른 요금이 청구됩니다.
- Directions API: 사용자가 선택한 모든 장소를 쿼리합니다.
- Place Photo API: 표시되는 모든 사진 1개를 쿼리합니다.
결론
지역 검색 환경은 사용자 가치를 제공하는 효과적인 방법입니다. 이 데모 구현에는 Nearby Search (New) API 의 특별한 기능을 사용하여 Google Maps Platform에 이러한 환경을 만들 때 포함할 수 있는 다양한 기능이 있습니다.
다음 단계
추가 추천 자료:
- Maps JavaScript API의 웹 구성요소
- Place Autocomplete 최적화
- 기타 장소 서비스
- 아래에 의견을 남겨주세요.
기여자
수석 저자:
토마스 앵글레렛 | Google 지도 플랫폼 솔루션 엔지니어