이 문서에서는 Nearby Search (New) API를 사용하는 방법을 살펴봅니다. ~ 간편하고 비용 효율적인 빌드
지역 검색 환경입니다.
지역 검색 환경에서 특정 위치 근처의 주요 관심 장소를 사용자에게 표시 검색 의도를 설정할 수 있습니다. 일반적으로 대화형 지도이며, 여기에는 장소 선택기 및 사진 갤러리가 있습니다. 다양한 Google Maps Platform이 제공됩니다. 제품과 기능을 개선하여 상호작용 경험을 향상할 수 있었습니다.
사용 사례
이제 로컬 검색 통합에서 어떤 요소가 사용자를 유도하는지 살펴보겠습니다. 값:
탐색 - 사용자에게 단일 위치 주변의 개요를 제공합니다. 다양한 유형의 관련성 높은 장소를 표시할 수 있습니다.
상호작용 - 사용자가 장소를 선택하고 데이터를 동적으로 새로고침할 수 있습니다.
표시됩니다.
시각화 - 장소 리뷰, 사진 제공
도보 시간과 거리를 계산하여 사용자가 자신의 요구사항에 부합하는지 빠르게 파악할 수 있도록 확인할 수 있습니다
참조 아키텍처
로컬 검색
지역 검색 환경을 만드는 방법에는 여러 가지가 있습니다. 다음 통합은 잘 활용되는 사용자 환경의 커스텀 예시 알려진 Google Maps Platform API와 몇 가지 흥미로운 새 기능을 추가했습니다. 만약 지역 검색에 대해 템플릿화된 접근 방식을 원하는 경우 웹 구성요소
샘플 애플리케이션
샘플 둘러보기
단계별 예시 애플리케이션은 아래의 표에 나와 있습니다. Google 지도의 기술적 구현에 대한 설명 플랫폼 API
1. AutocompleteSearch 위치를 사용한 위치 검색
- Maps JavaScript API를 로드합니다.
- Place Autocomplete 쿼리하거나 지도에서 위치를 선택합니다.
2. Nearby Search (New) API를 사용하여 지역 관심 장소를 표시
- 인기도 순위 (관련성이 더 높은 검색결과) 또는 거리 순위
includedTypes
,excludedTypes
, 호텔인 경우 호텔에서 모든 호텔을 '숙박 시설' 유형으로 분류되고 적합한 유형(예: '레스토랑, 카페, 공원, Tourit_attraction'이 표시됩니다.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로 상호작용 추가하기
- 경로 쿼리를 통해 경로 및 걸음 수 최신 상태 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회( 자동 완성 Widget에서 사용할 수 있음) 맞춤설정할 수 있습니다.
- 주변 검색 (신규) API를 참고하세요. 쿼리 1개(장소 20개 표시) 장소에 따라 다르게 청구됨 데이터 쿼리 응답의 일부인 쿼리 응답입니다
- 방법 API를 참고하세요. 사용자가 선택한 모든 장소마다 쿼리가 1개입니다.
- 장소 사진 API를 참고하세요. 표시된 모든 사진당 쿼리 1개
결론
지역 검색 환경은 사용자 가치를 제공하는 효과적인 방법입니다. 이 데모 구현에도 많은 기능이 있습니다. 특별한 기능을 사용하여 Google Maps Platform에서 이러한 환경 조성 Nearby Search (New) API에서 를 참고하세요.
다음 단계
추가 추천 자료:
- Maps JavaScript API의 웹 구성요소
- Place Autocomplete 최적화
- 기타 장소 서비스
- 아래에 의견을 남겨주세요.
참여자
수석 저자:
토마스 앵글레트 | Google 지도 플랫폼 솔루션 엔지니어