Z tego dokumentu dowiesz się, jak korzystać z interfejsu API wyszukiwania w pobliżu (Nowy) do tworzenia prostych i niedrogich
lokalnych treści w sekcji Odkrywanie.
Funkcja odkrywania lokalizacji wyświetla użytkownikom najważniejsze miejsca w pobliżu wybranej przez nich lokalizacji podczas wyszukiwania hotelu lub nieruchomości. Często składa się z interaktywnej mapy z dodatkowym panelem zawierającym selektor miejsc i galerię zdjęć. Poznasz różne produkty i funkcje Google Maps Platform, które zwiększają interaktywność.
Przykłady zastosowania
Teraz przyjrzyjmy się elementom integracji z lokalnym wyszukiwaniem, które zwiększają wartość dla użytkownika:
Odkrywanie – wyświetlanie użytkownikom informacji o tym, co znajduje się w pobliżu danej lokalizacji, co obejmuje wyświetlanie odpowiednich miejsc różnych typów.
Interaktywność – umożliwienie użytkownikom wybrania miejsca i dynamiczne odświeżanie danych.
względem tego miejsca.
Wizualizacja – udostępniaj opinie o miejscach i zdjęcia
oraz czas i odległość, aby użytkownicy mogli szybko sprawdzić, czy to miejsce odpowiada ich potrzebom.
Architektura referencyjna
Odkrywanie lokalne
Istnieje wiele sposobów tworzenia lokalnych kart. Poniżej przedstawiono niestandardowy przykład interfejsu użytkownika, który wykorzystuje znane interfejsy API Google Maps Platform oraz kilka nowych, ciekawych funkcji. Jeśli chcesz stosować szablony do lokalnego wyszukiwania, możesz użyć Web Components.
Przykładowa aplikacja
Przykładowy przewodnik
W tabeli poniżej znajdziesz przykładową aplikację podzieloną na kroki wraz z opisem technicznej implementacji z użyciem interfejsów API Google Maps Platform.
1. Szukanie lokalizacji z autouzupełnianiemSzukaj lokalizacji
- Wczytaj Maps JavaScript API.
- Autouzupełnianie miejsc lub wybierz lokalizację na mapie.
2. Wyświetlanie lokalnych punktów zainteresowania za pomocą interfejsu Nearby Search (New) API
- popularności (bardziej trafne wyniki) lub odległości.
includedTypes
,excludedTypes
; jeśli prowadzisz hotel, możesz wykluczyć typ „lodging” i uwzględnić tylko odpowiednie typy, np. „restaurant, cafe, park, tourit_attraction”.- Aby uzyskać jeszcze większą kontrolę nad wynikami, użyj
includedPrimaryTypes
iexcludedPrimaryTypes
. - `locationRestriction, aby uniknąć niewystarczającej liczby wyników lub miejsc zbyt daleko od siebie; w przypadku braku wyników, poszerz okrąg / prostokąt przed wyświetleniem wyników.
Przykład zapytania podczas rezerwacji hotelu z wymaganymi polami danych:
- Podstawowe (
displayName
,types
,openingHours
,formattedAddress
) - Kontakt (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - Preferowane (
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 } } }
Przykład zapytania podczas wyszukiwania nieruchomości z wymaganymi polami danych:
- Podstawowe (
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. Dodawanie interaktywności za pomocą interfejsu API Mapy dynamiczne i Skierowania
- Aktualne kroki i odcinki można uzyskać, wysyłając zapytanie do interfejsu API Trasy. * Wykorzystaj czas w następnej sekcji.
4. wyświetlać szczegółowe informacje o miejscu po interakcji z nim;
Opis:
displayName
,types
,rating
,userRatingCount
,priceLevel
.Time: pochodzi z poprzedniego zapytania do interfejsu Directions API.
Opinie:
reviews[i].author
,reviews[i].rating
,reviews[i].text
.Obrazy: w ramach nieograniczonego podglądu interfejsu API wyszukiwania w pobliżu (nowej wersji) musisz wysłać zapytanie do Places Details
place.id
, aby uzyskać photo_reference, a następnie wysłać zapytanie do jednego z nich.
Liczba zapytań i powiązane z nimi koszty
- Maps JavaScript API: 1 mapa podczas wczytywania interfejsu.
- Places Autocomplete API: 1 zapytanie na każdą wpisaną literę (jeśli używasz widżetu Autouzupełnianie), można go dostosować.
- Wyszukiwanie w pobliżu (nowy) interfejs API: 1 zapytanie na każde 20 wyświetlanych miejsc. Różne metody płatności w zależności od danych miejsca, które są częścią odpowiedzi na zapytanie.
- Directions API: 1 zapytanie na każde miejsce wybrane przez użytkownika.
- Place Photo API: 1 zapytanie na każde wyświetlane zdjęcie.
Podsumowanie
Funkcja odkrywania lokalnych informacji to skuteczny sposób na zwiększenie wartości dla użytkowników. Ta implementacja demonstracyjna zawiera wiele funkcji, które prawdopodobnie uwzględnisz podczas tworzenia takiej aplikacji w Google Maps Platform z użyciem specjalnych funkcji interfejsu API wyszukiwania w pobliżu (nowy) .
Następne kroki
Sugerowane materiały do dalszego zapoznania się z tematem:
- Komponenty sieciowe w Maps JavaScript API
- Optymalizacja autouzupełniania w Places
- Inne Usługi Miejsca
- Poniżej możesz zostawić opinię.
Współtwórcy
Główni autorzy:
Thomas Anglaret | inżynier ds. rozwiązań platformowych w Google Maps