Catatan:

Gunakan ScribbleMaps Connect Picker jika Anda ingin pengguna masuk ke Scribble Maps, menelusuri peta yang tersedia bagi mereka, dan mengembalikan data peta langsung ke aplikasi web Anda.

 

Picker terbuka dalam popup dan menangani proses masuk pengguna di sana, sehingga aplikasi Anda tidak perlu mengumpulkan kredensial Scribble Maps secara langsung.

Daftar Isi

Cara kerja Connect Picker

ScribbleMaps Connect Picker memungkinkan pengguna Anda untuk menelusuri, mencari, dan memilih peta dari Scribble Maps, lalu mengembalikan data peta tersebut langsung ke aplikasi Anda dalam format yang Anda pilih.

Ini berguna jika Anda ingin pengguna membuat atau mengelola geodata di Scribble Maps lalu memuat data tersebut ke aplikasi Anda sendiri tanpa membangun browser peta atau alur masuk sendiri.

Kasus Penggunaan / Contoh:

Integrasi ini berguna untuk dasbor, alat properti, aplikasi data lapangan, dan aplikasi web lainnya yang mengharuskan pengguna memilih dan memuat data yang dipetakan dari Scribble Maps.

Lihat Daftar Isi ↑

Dapatkan Client ID Anda

1. Buka situs pengembang Scribble Maps:
   https://developers.scribblemaps.com

    

2. Daftar proyek gratis.

    

3. Salin Client ID Anda.

   Anda akan menggunakan nilai ini saat memanggil Connect Picker.

Lihat Daftar Isi ↑

Tambahkan SDK ke halaman Anda

1. Pada halaman web Anda, tambahkan SDK Connect Picker:

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

    

2. Simpan perubahan halaman Anda.

   Scribble Maps Connect Picker kini tersedia untuk aplikasi Anda.

Lihat Daftar Isi ↑

Buka Connect Picker

1. Panggil ScribbleMapsConnect.pick() dari halaman Anda.

    

2. Lewatkan clientId Anda, format ekspor yang Anda inginkan, dan callback onSelect.

    

3. Gunakan kode yang mirip dengan contoh berikut:

   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);
     }
   });

   Jika picker terbuka, pengguna dapat melakukan autentikasi, menelusuri peta yang tersedia bagi mereka, dan memilih salah satunya.

Lihat Daftar Isi ↑

Tangani data peta yang dipilih

1. Dalam callback onSelect, akses result.data.

   Ini berisi data peta dalam format yang Anda minta.
    

2. (Opsional) Gunakan bidang tambahan yang dikembalikan:

   • result.title — judul peta
   • result.mapCode — kode peta Scribble Maps
   • result.thumbUrl — URL thumbnail untuk peta
    

3. Lewatkan data tersebut ke dalam logika aplikasi Anda.

   Misalnya, muat GeoJSON yang dikembalikan ke penampil peta atau alur kerja data Anda sendiri.

Lihat Daftar Isi ↑

Konfigurasi opsional

Anda dapat mengonfigurasi picker agar lebih sesuai dengan alur kerja aplikasi Anda.

1. Pilih format ekspor dengan mengubah nilai format.

   Misalnya: geojson, kml, csv, gpx, dxf, shapefile, atau smjson.
    

2. Pilih sumber peta mana yang dapat ditelusuri pengguna dengan opsi tabs.

   Pengguna dapat menelusuri peta dari pustaka pribadi mereka, peta yang dibagikan tim, atau koleksi komunitas.
    
3. (Opsional) Gunakan gaya tombol yang disertakan agar sesuai dengan antarmuka terang atau gelap.

Lihat Daftar Isi ↑

Format yang didukung dan bidang yang dikembalikan

Format ekspor yang didukung:

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

Bidang hasil yang dikembalikan:

• data
• title
• mapCode
• thumbUrl

Sekali dikonfigurasi, Connect Picker memberi pengguna Anda akses ke data Scribble Maps mereka langsung dari dalam aplikasi Anda melalui satu titik integrasi.

Terkait

Scribble Maps Developers

Scribble Maps Connect Picker

Impor/Ekspor File & Data - GeoJSON, images, PDF, CSV, KML, GXP, SHP, DXF, SMJSON, SMT, WKT, dll.

Impor/Ekspor: Deskripsi, Contoh, Batasan dan Solusi - CSV, DXF, GeoJSON, GPX, KML, KMZ, SHP