Dans ce document, vous allez apprendre à utiliser l'API Nearby Search (nouvelle version) à créer une plate-forme simple et rentable
de découverte en local.
Une expérience de découverte locale montre aux utilisateurs les principaux lieux d'intérêt à proximité d'un établissement. que vous spécifiez lorsque vous recherchez un hôtel ou un bien immobilier. Il se compose souvent d'une carte interactive, avec un panneau supplémentaire contenant un sélecteur de lieux et une galerie de photos. Vous verrez différentes versions de Google Maps Platform pour améliorer 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 à proximité d'un lieu en affichant des lieux pertinents de différents types.
Interactivité : permet aux utilisateurs de sélectionner un lieu et de mettre à jour dynamiquement les données.
par rapport à ce lieu.
Visualisation : fournissez des avis et des photos sur des lieux.
et le temps de trajet à pied et la distance pour que les utilisateurs comprennent rapidement s’il correspond leurs besoins.
Architecture de référence
Découverte locale
Il existe de nombreuses façons de créer une expérience de découverte locale. L'intégration suivante est un exemple personnalisé d'une expérience utilisateur qui exploite des API Google Maps Platform bien connues, ainsi que de nouvelles fonctionnalités intéressantes. Si vous vous souhaitez adopter une approche modélisée de la découverte locale. Vous pouvez utiliser des Composants.
Exemple d'application
Exemple de tutoriel
Le tableau ci-dessous présente l'exemple d'application par étapes, ainsi qu'une description de l'implémentation technique avec les API Google Maps Platform.
1. Recherche de lieu avec la localisation AutocompleteSearch
- Chargez l'API Maps JavaScript.
- Requête Places Autocomplete ou sélection d'un lieu sur la carte.
2. Afficher des points d'intérêt locaux avec l'API Nearby Search (nouvelle version)
- Classement par popularité (résultats plus pertinents) ou classement par distance.
includedTypes
,excludedTypes
; si vous êtes un hôtel, vous pouvez exclure "hébergement" et n'incluent que les types adaptés (par exemple, "restaurant, café, parc, tourit_attraction".- Tirez parti de
includedPrimaryTypes
etexcludedPrimaryTypes
pour encore plus de contrôle sur les résultats. - "locationRestriction" pour éviter un nombre insuffisant de résultats ou trop éloigné lieux ; S'il n'y a AUCUN résultat, élargissez la taille du cercle / rectangle avant pour afficher les résultats.
Exemple de requête lors de la réservation d'un hôtel avec des champs de données demandés:
- Standard (
displayName
,types
,openingHours
,formattedAddress
) - Contact (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - Préféré (
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 lorsque vous recherchez un bien immobilier avec des champs de 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 de l'interactivité avec l'API Dynamic Maps and Directions
- Étapes et segments à jour en interrogeant l'API Directions. * Répartir le temps dans la section suivante
4. Afficher des informations détaillées sur le lieu lors de l'interaction
Description :
displayName
,types
,rating
,userRatingCount
etpriceLevel
.Time (Heure) : provenant de la requête précédente 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 (nouvelle), vous devront interroger Places Détails avec
place.id
pour obtenir photo_reference puis d'interroger les données les unes après les autres
Nombre de requêtes et coût associé
- API Maps JavaScript : une carte lors du chargement de l'expérience.
- API Places Autocomplete: une requête par caractère saisi (si vous utilisez la Saisie semi-automatique (un widget), il peut être personnalisé.
- Nearby Search (nouveau) API: 1 requête toutes les 20 lieux affichés. Facturation différente en fonction du Lieu données qui font partie de 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 moyen efficace de créer de la valeur pour les utilisateurs. Cette implémentation de 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
Lectures complémentaires suggérées :
- Composants Web dans l'API Maps JavaScript
- Optimisation de Place Autocomplete
- Autres services Places
- Laissez un commentaire ci-dessous.
Contributeurs
Principaux auteurs:
Thomas Anglaret | Google Maps Platform Solutions Engineer