Dans ce document, vous découvrirez comment utiliser l'API Nearby Search (New) pour créer une interface simple et économique
de découverte locale.
Une expérience de découverte locale montre aux utilisateurs les principaux lieux d'intérêt à proximité d'un lieu que vous spécifiez lorsqu'ils recherchent un hôtel ou un bien immobilier. Il s'agit souvent d'une carte interactive, avec un panneau supplémentaire contenant un sélecteur de lieux et une galerie de photos. Vous découvrirez différents produits et fonctionnalités Google Maps Platform permettant d'améliorer l'expérience grâce à l'interactivité.
Cas d'utilisation
Voyons maintenant quels éléments de l'intégration de la découverte locale génèrent de la valeur pour l'utilisateur:
Découverte : donnez aux utilisateurs un aperçu de ce qui se trouve autour d'un même établissement en affichant différents types de lieux pertinents.
Interactivité : permettez aux utilisateurs de sélectionner un lieu et d'actualiser les données de manière dynamique.
par rapport à ce lieu.
Visualisation : fournissez des avis sur des lieux et des photos
ainsi que du temps de trajet et de la distance à parcourir pour que les utilisateurs comprennent rapidement si cela répond à leurs besoins.
Architecture de référence
Découverte locale
Il existe de nombreuses façons de favoriser la découverte locale. L'intégration suivante est un exemple personnalisé d'expérience utilisateur qui exploite des API Google Maps Platform bien connues, ainsi que de nouvelles fonctionnalités intéressantes. Si vous souhaitez avoir une approche modélisée de la découverte locale, vous pouvez utiliser les composants Web.
Exemple d'application
Exemple de tutoriel
Vous trouverez dans le tableau situé sous l'exemple d'application plusieurs étapes et une description de l'implémentation technique avec les API Google Maps Platform.
1. Lieu pour la recherche de lieu avec AutocompleteSearch
- Chargez l'API Maps JavaScript.
- Place Autocomplete ou de choisir un lieu sur la carte.
2. Mettre en avant des points d'intérêt locaux avec l'API Nearby Search (New)
- Classement par popularité (résultats plus pertinents) ou classement par distance.
includedTypes
,excludedTypes
; si vous êtes un hôtel, vous pouvez exclure le type "hébergement" et n'inclure que des types adaptés (par exemple, "restaurant, café, parc, attraction_touristique").- Utilisez
includedPrimaryTypes
etexcludedPrimaryTypes
pour encore plus de contrôle sur les résultats. - "locationRestriction" pour éviter un nombre insuffisant de résultats ou des lieux trop éloignés. En cas de zéro résultat, élargissez la taille du cercle / rectangle avant d'afficher les résultats.
Exemple de requête lors d'une réservation d'hôtel avec des champs de données demandés:
- De base (
displayName
,types
,openingHours
,formattedAddress
) - Contact (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - À privilégier (
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 } } }
Exemple de requête lors de la recherche d'un bien immobilier avec les champs "Données" demandés:
- De base (
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. Ajouter l'interactivité avec l'API Dynamic Maps et Directions
- Mise à jour des étapes et étapes en interrogeant l'API Directions * Utilisez le temps imparti dans la section suivante.
4. Afficher des informations détaillées sur le lieu lors d'une interaction
Description:
displayName
,types
,rating
,userRatingCount
,priceLevel
.Heure: provenant de la précédente requête de l'API Directions.
Avis:
reviews[i].author
,reviews[i].rating
,reviews[i].text
.Images: lors de l'aperçu sans restriction de l'API Nearby Search (New), vous devrez interroger Places Details avec
place.id
pour obtenir photo_reference, puis interroger une par une dans votre expérience.
Nombre de requêtes et coût associé
- API Maps JavaScript : une carte au chargement de l'expérience.
- API Places Autocomplete: une requête pour chaque caractère saisi (si vous utilisez le widget Autocomplete), que vous pouvez personnaliser.
- API Nearby Search (New) : une requête tous les 20 lieux affichés. Facturation différente en fonction des données de lieu incluses dans la réponse à la requête.
- API Directions : une requête pour chaque lieu sélectionné par l'utilisateur.
- API Place Photo : une requête pour chaque photo affichée.
Conclusion
Une expérience de découverte locale est un excellent moyen de créer de la valeur pour l'utilisateur. Cette implémentation de la démonstration comporte de nombreuses fonctionnalités que vous êtes susceptible d'inclure lorsque vous créez une telle expérience sur Google Maps Platform, avec des fonctionnalités spéciales de l'API Nearby Search (New) .
Étapes suivantes
Autres ressources suggérées:
- Composants Web dans l'API Maps JavaScript
- Optimisation de Place Autocomplete
- Autres services Places
- Laissez un commentaire ci-dessous.
Contributeurs
Auteurs principaux:
Thomas Anglaret | Ingénieur en solutions Google Maps Platform