Table des matières
Pour créer une application de géolocalisation à partir des données de Google Maps, collectez les données d'entreprise, normalisez-les selon votre propre schéma, puis stockez-les dans une base de données telle que Supabase/PostgreSQL.
Pour Données Google Maps pour le développement d'applications, la collecte des enregistrements n'est qu'une première étape. L'application a encore besoin de champs qu'elle puisse identifier, mettre à jour, interroger, mettre en correspondance et relier à ses propres données.
Dans cet exemple, un petit extrait JSON tiré de Outscraper’s Catalogue d'entreprises est normalisée avec TypeScript puis importée dans Supabase/PostgreSQL pour un MVP basé sur la localisation appelé Nomad PH.
L'échantillon comprend trois entreprises situées à General Luna, sur l'île de Siargao. Son objectif est de tester le processus d'intégration des données, et non de refléter l'ensemble des entreprises présentes à Siargao ou aux Philippines.
La tâche principale consiste à transformer le JSON Outscraper en enregistrements prêts à être utilisés par l'application, capables de prendre en charge les fiches de produits, les pages de détails, les cartes et, ultérieurement, les fonctionnalités spatiales.
Réponse rapide : Comment utiliser les données de Google Maps dans une application de géolocalisation
- Collectez les documents comptables à l'aide de Outscraper.
- Exporter les données au format JSON.
- Normalisez les champs à l'aide de TypeScript.
- Mettez en correspondance les enregistrements avec le schéma de votre application.
- Insérez-les ou mettez-les à jour dans Supabase/PostgreSQL.
- Utilisez-les dans les fiches, les pages et les cartes.
Utilisez le catalogue d'entreprises de Outscraper pour disposer d'enregistrements d'entreprises prêts à l'emploi avant de créer votre workflow d'ingestion.
De quelles données Google Maps une application de géolocalisation a-t-elle besoin ?
Une application de localisation n'a pas besoin de tous les champs disponibles dans un enregistrement source. Elle a besoin des champs qui lui permettent d'identifier un lieu, d'afficher des informations utiles et de relier ce lieu à d'autres éléments.
Pour le Nomad PH MVP, les enregistrements Outscraper ont fourni les données de base relatives à l'activité et à la localisation. L'application a ensuite stocké les champs sélectionnés dans sa propre lieux tableau
Champs clés relatifs à l'identité d'un lieu
Le premier groupe de champs répond à une question fondamentale : C'est quel endroit ?
Pour cette mise en œuvre, les principaux champs d'identité et de localisation étaient les suivants :
nameplace_idlatitudelongitudeadressebusiness_status
Les name et l' adresse permettent aux utilisateurs d'identifier l'entreprise, tandis que la latitude et la longitude fournissent à l'application une position géographique.
L'importateur conserve également place_id en tant qu'identifiant externe utilisé pour les opérations « upsert » dans ce MVP. Si le même lieu apparaît lors d'une importation ultérieure, l'application peut mettre à jour l'enregistrement existant au lieu d'en créer un autre.
Cela ne signifie pas que place_id doit être considéré comme un identifiant permanent pour tous les flux de données possibles. Il s'agit simplement de l'identifiant source choisi pour cette implémentation.
Champs de découverte et de référencement
Une fiche de lieu ne se limite généralement pas à une simple identification et à des coordonnées. Les utilisateurs ont également besoin d'informations suffisantes pour décider s'ils souhaitent consulter la fiche ou se rendre sur place.
Le MVP stocke des champs tels que :
- rating
- nombre d'avis
- site web
- phone
- type d'activité
- URL de Google Maps
Ces champs peuvent être utilisés pour les listes de destinations, les fiches de lieu, les pages de détails et les filtres au sein de l'application.
Les catégories de sources doivent également faire l'objet d'un certain contrôle. Au lieu de copier directement chaque sous-type brut dans l'application, Nomad PH les regroupe en un ensemble plus restreint de types de lieux :
- café
- coworking
- coliving
- hôtel
- auberge de jeunesse
- restaurant
- autre
Une liste contrôlée permet de garantir la prévisibilité des catégories de l'application, même lorsque les données source contiennent plusieurs sous-types métier.
Séparer les données sources des données spécifiques à l'application
Le fichier d'activité importé ne constitue qu'une couche de l'application.
Outscraper fournit les champs relatifs à l'entreprise et à son emplacement utilisés dans ce MVP, tels que l'identifiant du lieu, les coordonnées, les notes, les coordonnées de contact et le statut de l'entreprise.
Nomad PH sépare les données relatives à son application de celles concernant sa communauté, notamment :
- Rapports sur la vitesse du Wi-Fi
- débit de téléchargement
- ping
- observations sur le générateur
- observations relatives aux coupures de courant
- avis des utilisateurs
- règles de vérification
Cette distinction est importante, car l'enregistrement source et les données propres à l'application ont des rôles différents.
Les Outscraper Cette fiche identifie et décrit le lieu. Nomad PH peut ensuite ajouter ses propres données concernant ce même lieu sans considérer les informations générées par la communauté comme faisant partie de la fiche d'entreprise d'origine de Google Maps.
Collectez les données sources avec Outscraper Business Catalog
La première étape consiste à rassembler les documents administratifs requis pour votre demande.
Pour le Nomad PH MVP, j'ai utilisé ceux de Outscraper Catalogue d'entreprises afin de constituer un petit échantillon d'entreprises à General Luna, sur l'île de Siargao. Trois enregistrements ont suffi pour tester le flux d'importation depuis un fichier JSON vers la base de données de l'application.
Pour un guide complet sur le filtrage et l'exportation des enregistrements, consultez le Guide du catalogue commercial Outscraper.
Précisez le lieu et le type d'activité
Commencez par sélectionner le lieu et la catégorie correspondant à votre demande.
Pour ce MVP :
- Lieu : General Luna, Siargao.
- Type d'entreprise : cafés
- Source : Catalogue commercial Outscraper
- Résultat : Fiches commerciales au format JSON
Le fait de limiter la taille de l'échantillon a facilité l'examen des champs source avant de développer l'importateur.
Pour élargir la collecte de données Google Maps, la solution existante de Outscraper Guides sur les outils de capture de données Google Maps aborder plus en détail le processus de recouvrement.
Exporter les enregistrements au format JSON
Pour ce MVP, j'ai utilisé un petit extrait tiré de Outscraper’s Catalogue d'entreprises au lieu de lancer une nouvelle tâche de collecte de données sur Google Maps. L'utilisation de fiches d'entreprise prêtes à l'emploi m'a permis de tester immédiatement le flux de travail d'ingestion sans avoir à attendre la fin d'une nouvelle tâche de collecte de données.
Ce même flux de travail peut également démarrer à partir d'un fichier JSON exporté depuis Outscraper’s Le Scraping Google Maps. Dans les deux cas, l'essentiel réside dans les données métier structurées qui sont intégrées à l'application.
Le format JSON s'intégrait bien au processus d'ingestion, car il permettait facilement de :
- vérifier dans VS Code
- analyser avec TypeScript
- conserver les champs source imbriqués
- passer dans un script de normalisation
- conserver l'enregistrement original pour pouvoir s'y référer ultérieurement
Le fichier JSON a ensuite servi de source d'entrée pour les étapes de normalisation et d'importation dans Supabase.
Utilisez le catalogue d'entreprises de Outscraper ou l'outil de collecte de données Google Maps Scraper pour récupérer les fiches d'entreprises et de localisation dont votre application a besoin, puis exportez-les pour votre workflow d'ingestion.
Convertir le format JSON Outscraper en enregistrements prêts à l'emploi
Le JSON brut est utile en tant que source, mais une application a généralement besoin d'un schéma plus compact et plus prévisible.
Pour le Nomad PH MVP, l'importateur lit le fichier JSON Outscraper, sélectionne les champs dont l'application a besoin, puis les convertit dans le lieux tableau, et conserve l'enregistrement source d'origine à titre de référence.
Normaliser les champs dont l'application a réellement besoin
L'importateur mappe les champs source au modèle d'application au lieu de stocker chaque champ directement.
Pour cette version, cela inclut notamment les éléments suivants :
- raison sociale
- identifiant du lieu
- adresse
- latitude
- longitude
- rating
- nombre d'avis
- statut de l'entreprise
- site web
- phone
- URL de Google Maps
- type de lieu
Cela facilite la recherche et l'utilisation des enregistrements au sein de l'application.
Il convient de vérifier que les noms exacts des champs source correspondent bien au fichier JSON Outscraper réel avant de publier tout exemple de code.
Mapper les catégories sources dans la taxonomie de votre propre application
Les catégories d'activité source peuvent être plus détaillées que ne l'exige l'application.
Nomad PH utilise une liste interne plus restreinte :
cafécoworkingcolivinghôtelauberge de jeunesserestaurantautre
Cela permet de garantir la prévisibilité du filtrage et de la logique de navigation.
Par exemple, plusieurs sous-types de sources liés aux cafés peuvent toujours correspondre au même interne café type. L'application gère la catégorie finale au lieu de s'appuyer sur chaque sous-type brut renvoyé par la source.
Générer des slugs lisibles
Chaque lieu importé doit également disposer d'un slug d'URL lisible.
Par exemple :
Espace sur le toit du Gaya
devient :
gaya-espace-sur-le-toit
Le slug est généré lors de la normalisation, ce qui permet à l'enregistrement d'être prêt à être utilisé dans des chemins d'accès tels que la page de détails d'un lieu.
Conserver la charge utile d'origine
L'importateur gère deux champs liés à la source :
source = " outscraper "source_payload = enregistrement JSON d'origine
Il est utile de conserver la charge utile brute, car l'enregistrement normalisé ne contient pas tous les champs source.
Cela fournit à l'application un point de référence pour :
- vérification des transformations
- dépannage des problèmes d'importation
- remapper les champs ultérieurement
- vérification des valeurs sources qui n'ont pas été ajoutées au schéma principal
Cela permet de conserver la propreté du schéma de l'application sans supprimer l'enregistrement d'origine.
Utilisez l'API Google Maps de Outscraper pour transmettre des données professionnelles vers votre propre application ou votre workflow backend sans avoir à recourir à des exportations manuelles.
Importer les données de Google Maps dans Supabase
Une fois les enregistrements Outscraper normalisés, l'étape suivante consiste à les stocker dans la base de données de l'application.
Pour Nomad PH, l'importateur envoie les enregistrements normalisés vers Supabase lieux table gérée par PostgreSQL.
Supabase propose une base de données Postgres qui peut être géré via son tableau de bord ou accessible par programmation.
Importez les données normalisées dans la table « places »
Cette table contient les champs dont l'application a besoin pour les listes, les itinéraires, le filtrage et les fonctionnalités cartographiques à venir.
Parmi les champs importants, on peut citer :
iddestination_ididentifiant_du_quartiernamelimacetype_de_lieuadresselatitudelongitudeplace_idgoogle_ratinggoogle_reviews_countbusiness_statussite webphonegoogle_maps_urlsourcesource_payloadis_published
L'objet normalisé est mappé dans cette structure avant que l'écriture dans la base de données n'ait lieu.
Cela permet de garantir la cohérence du modèle de base de données, même si le fichier JSON source contient davantage de champs que ceux actuellement utilisés par l'application.
Utiliser l'« upsert » plutôt que l'insertion aveugle
L'importateur utilise un upsert, qui met à jour un enregistrement existant lorsque le même place_id si l'enregistrement existe, ou en insère un nouveau s'il n'existe pas.
L'importateur utilise place_id comme identifiant externe pour cette implémentation.
Le raisonnement est simple :
- si le
place_ids'il existe déjà, mettre à jour l'enregistrement existant - s'il n'existe pas, insérer un nouvel enregistrement
Cela permet d'éviter la création d'enregistrements de lieux en double lorsqu'une même entreprise est importée une nouvelle fois.
Pour ce MVP, place_id Il s'agissait de l'identifiant source choisi pour la logique « upsert ». Il ne faut pas le considérer comme une règle universelle applicable à toutes les applications.
Importer des enregistrements par lots
L'importateur traite les enregistrements par lots de 200.
Cette taille de lot relevait d'un choix technique pour ce projet, et non d'une exigence Outscraper.
Un même importateur peut traiter des lots plus petits ou plus volumineux en fonction de l'application, des limites de la base de données et de la taille de la tâche.
Les fiches importées sont également définies par défaut comme « non publiées » afin de pouvoir être vérifiées avant leur apparition dans l'application.
Cela offre à l'application un point de contrôle supplémentaire entre les données sources et le contenu public.
Utilisez les enregistrements importés dans votre application de géolocalisation
Une fois les enregistrements importés dans Supabase, l'application peut les utiliser comme n'importe quel autre contenu de base de données structurée.
Pour Nomad PH, les lieux importés permettent de gérer les listes de destinations, les pages dédiées à chaque lieu et la navigation sur carte sans avoir à lire directement le fichier JSON d'origine.
Afficher les cartes de table et les pages de détails
Une fiche de lieu de stockage peut alimenter différentes parties de l'interface.
Par exemple :
Enregistrement d'un lieu dans Supabase
→ liste des destinations
→ marque-place
→ page de détails sur le lieu
Next.js utilisations routage basé sur des fichiers, ce qui permet de créer facilement un itinéraire distinct pour chaque fiche de lieu enregistrée.
Des domaines tels que name, limace, type_de_lieu, adresse, la note, le site web et le numéro de téléphone peuvent être affichés là où ils sont utiles.
Les données ayant déjà été normalisées, l'interface utilisateur n'a pas besoin de comprendre l'intégralité de la réponse Outscraper à chaque fois qu'elle affiche un lieu.
Utiliser les coordonnées pour les cartes et les entités spatiales
Les enregistrements importés conservent également latitude et l' longitude.
Ces coordonnées pourront ensuite servir à :
- marqueurs sur la carte
- navigation géographique
- Points géographiques PostGIS
- recherches de lieux à proximité
Dans le cadre de ce MVP, les coordonnées sont d'abord enregistrées afin que les enregistrements soient prêts pour les travaux cartographiques et spatiaux ultérieurs.
La logique complète de recherche de proximité de PostGIS dépasse le cadre du présent article.
Pour en savoir plus sur la manière dont les workflows d'application peuvent récupérer des données de Google Maps, consultez API Google Maps vs. extraction de données sur le Web.
Ajouter des données spécifiques à l'application par-dessus
L'enregistrement Outscraper fournit la couche « activité » et la couche « emplacement ».
Nomad PH peut alors ajouter ses propres données concernant ce même lieu, telles que :
- Rapports sur la vitesse du Wi-Fi
- débit de téléchargement
- ping
- observations sur le générateur
- observations relatives aux coupures de courant
- avis des utilisateurs
- logique de vérification
Cela permet de séparer les données sources des informations générées au sein de l'application.
On obtient ainsi un modèle de données simple :
Liste de contrôle finale : créer une application géolocalisée à l'aide des données de Google Maps
- Rassemblez les documents comptables à l'aide de Outscraper.
- Exportez et normalisez les champs JSON dont votre application a besoin.
- Mettez en correspondance les enregistrements avec le schéma de votre propre base de données.
- Insérer ou mettre à jour les enregistrements dans Supabase/PostgreSQL.
- Utilisez les données enregistrées pour les annonces, les pages de détail, les cartes et, ultérieurement, les fonctionnalités spatiales.
Utilisez Outscraper pour collecter des données d'entreprise structurées, les normaliser selon votre propre schéma et les stocker dans Supabase afin de les utiliser pour les listes, les cartes et d'autres fonctionnalités de l'application.
FAQ
Questions et réponses les plus fréquentes
Oui, mais le mappage des champs source vers votre propre schéma vous offre un meilleur contrôle sur les catégories, les mises à jour et la structure de la base de données.
Supabase stocke les enregistrements de lieux normalisés dans PostgreSQL et les met à la disposition de l'application Next.js.
Oui. Les coordonnées de latitude et de longitude enregistrées peuvent servir à créer des marqueurs sur une carte et, par la suite, permettre d'effectuer des recherches de lieux à proximité avec PostGIS.
Oui. En conservant le fichier JSON d'origine dans source_payload facilite le débogage, la vérification des transformations et l'ajout ultérieur de champs.
Une opération « upsert » met à jour un enregistrement s'il existe déjà ou en insère un nouveau s'il n'existe pas. Dans ce MVP, place_id sert à déterminer si un lieu doit être u
