Note :

Utilisez le ScribbleMaps Connect Picker lorsque vous souhaitez que les utilisateurs se connectent à Scribble Maps, parcourent leurs cartes disponibles et renvoient les données cartographiques directement à votre application web.

 

Le sélecteur s'ouvre dans un popup et y gère le processus de connexion de l'utilisateur, de sorte que votre application n'a pas besoin de collecter directement les identifiants Scribble Maps.

Table des matières

Comment fonctionne le Connect Picker

Le ScribbleMaps Connect Picker permet à vos utilisateurs de parcourir, rechercher et sélectionner des cartes de Scribble Maps, puis de renvoyer ces données cartographiques directement à votre application dans le format de votre choix.

Ceci est utile lorsque vous souhaitez que les utilisateurs créent ou gèrent des géodonnées dans Scribble Maps, puis chargent ces données dans votre propre application sans avoir à créer votre propre navigateur de cartes ou flux de connexion.

Cas d'utilisation / Exemple :

Cette intégration est utile pour les tableaux de bord, les outils immobiliers, les applications de données de terrain et d'autres applications web qui nécessitent que les utilisateurs sélectionnent et chargent des données cartographiées à partir de Scribble Maps.

Afficher la table des matières ↑

Obtenir votre Client ID

1. Ouvrez le site développeur de Scribble Maps :
   https://developers.scribblemaps.com

    

2. Enregistrez un projet gratuit.

    

3. Copiez votre Client ID.

   Vous utiliserez cette valeur lors de l'appel du Connect Picker.

Afficher la table des matières ↑

Ajouter le SDK à votre page

1. Dans votre page web, ajoutez le SDK du Connect Picker :

   <script src="https://api.scribblemaps.com/connect/picker.js"></script>

    

2. Enregistrez les modifications de votre page.

   Le Scribble Maps Connect Picker est désormais disponible pour votre application.

Afficher la table des matières ↑

Ouvrir le Connect Picker

1. Appelez ScribbleMapsConnect.pick() depuis votre page.

    

2. Passez votre clientId, le format d'exportation souhaité et un rappel (callback) onSelect.

    

3. Utilisez un code similaire à l'exemple suivant :

   ScribbleMapsConnect.pick({
     clientId: 'YOUR_CLIENT_ID',
     format: 'geojson',
     onSelect: function (result) {
       // result.data contains your GeoJSON
       // result.title, result.mapCode, result.thumbUrl also available
       loadIntoMyApp(result.data);
     }
   });

   Lorsque le sélecteur s'ouvre, l'utilisateur peut s'authentifier, parcourir ses cartes disponibles et en sélectionner une.

Afficher la table des matières ↑

Gérer les données de la carte sélectionnée

1. Dans le rappel onSelect, accédez à result.data.

   Celui-ci contient les données cartographiques dans le format demandé.
    

2. (Optionnel) Utilisez les champs supplémentaires retournés :

   • result.title — le titre de la carte
   • result.mapCode — le code de carte Scribble Maps
   • result.thumbUrl — une URL de vignette pour la carte
    

3. Passez les données dans la logique de votre application.

   Par exemple, chargez le GeoJSON retourné dans votre propre visualiseur de cartes ou flux de données.

Afficher la table des matières ↑

Configuration optionnelle

Vous pouvez configurer le sélecteur pour qu'il corresponde mieux au flux de travail de votre application.

1. Sélectionnez le format d'exportation en modifiant la valeur de format.

   Par exemple : geojson, kml, csv, gpx, dxf, shapefile ou smjson.
    

2. Choisissez les sources de cartes que les utilisateurs peuvent parcourir avec l'option tabs.

   Les utilisateurs peuvent parcourir les cartes de leur bibliothèque personnelle, les cartes partagées en équipe ou la collection de la communauté.
    
3. (Optionnel) Utilisez les styles de boutons inclus pour correspondre à une interface claire ou sombre.

Afficher la table des matières ↑

Formats pris en charge et champs retournés

Formats d'exportation pris en charge :

• GeoJSON
• KML
• CSV
• GPX
• DXF
• Shapefile
• SMJSON

Champs de résultat retournés :

• data
• title
• mapCode
• thumbUrl

Une fois configuré, le Connect Picker donne à vos utilisateurs un accès direct à leurs données Scribble Maps depuis votre application via un point d'intégration unique.

Sujets connexes

Scribble Maps Developers

Scribble Maps Connect Picker

Importer/Exporter des fichiers et des données - GeoJSON, images, PDF, CSV, KML, GXP, SHP, DXF, SMJSON, SMT, WKT, etc.

Import/Export : Descriptions, exemples, restrictions et solutions de contournement - CSV, DXF, GeoJSON, GPX, KML, KMZ, SHP