Додайте ScribbleMaps до вашого застосунку
Примітка:Використовуйте ScribbleMaps Connect Picker, коли хочете, щоб користувачі входили в Scribble Maps, переглядали свої доступні карти та повертали дані карти безпосередньо у ваш веб-застосунок.Пікер відкривається у спливаючому вікні та обробляє там процес входу користувача, тому вашому застосунку не потрібно напряму збирати облікові дані Scribble Maps.
Зміст
Отримайте свій Client ID
Додайте SDK на свою сторінку
Відкрийте Connect Picker
Обробіть вибрані дані карти
Додаткові налаштування
Підтримувані формати та поля, що повертаються
Як працює Connect Picker
ScribbleMaps Connect Picker дозволяє вашим користувачам переглядати, шукати та вибирати карти зі Scribble Maps, а потім повертати ці дані карти безпосередньо у ваш застосунок у форматі, який ви оберете.
Це корисно, коли ви хочете, щоб користувачі створювали або керували геоданими в Scribble Maps, а потім завантажували ці дані у ваш власний застосунок без створення власного браузера карт чи процесу входу.
Випадок використання / Приклад:
Ця інтеграція корисна для панелей керування, інструментів роботи з нерухомістю, застосунків для польових даних та інших веб-застосунків, яким потрібно, щоб користувачі вибирали та завантажували картографічні дані зі Scribble Maps.
Отримайте свій Client ID
-
Відкрийте сайт розробників Scribble Maps:
https://developers.scribblemaps.com -
Зареєструйте безкоштовний проєкт.
-
Скопіюйте свій Client ID.
Ви використовуватимете це значення під час виклику Connect Picker.
Додайте SDK на свою сторінку
-
На своїй веб-сторінці додайте SDK Connect Picker:
<script src="https://api.scribblemaps.com/connect/picker.js"></script>
-
Збережіть зміни на своїй сторінці.
Тепер Scribble Maps Connect Picker доступний у вашому застосунку.
Відкрийте Connect Picker
-
Викличте ScribbleMapsConnect.pick() зі своєї сторінки.
-
Передайте свій clientId, потрібний format для експорту та зворотний виклик onSelect.
-
Використайте код, подібний до наведеного прикладу:
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); } });Коли пікер відкриється, користувач може автентифікуватися, переглянути свої доступні карти та вибрати одну з них.
Обробіть вибрані дані карти
-
У зворотному виклику onSelect отримайте доступ до result.data.
Він містить дані карти у форматі, який ви запросили. -
(Необов'язково) Використайте додаткові поля, що повертаються:
- result.title — назва карти
- result.mapCode — код карти Scribble Maps
- result.thumbUrl — URL мініатюри карти
-
Передайте дані в логіку вашого застосунку.
Наприклад, завантажте отриманий GeoJSON у свій власний переглядач карт або робочий процес обробки даних.
Додаткові налаштування
Ви можете налаштувати пікер так, щоб він краще відповідав робочому процесу вашого застосунку.
-
Виберіть формат експорту, змінивши значення format.
Наприклад: geojson, kml, csv, gpx, dxf, shapefile або smjson. -
Виберіть, які джерела карт можуть переглядати користувачі за допомогою параметра tabs.
Користувачі можуть переглядати карти зі своєї особистої бібліотеки, карт, спільних для команди, або з колекції спільноти. - (Необов'язково) Використайте вбудовані стилі кнопок, щоб відповідати світлому або темному інтерфейсу.
Підтримувані формати та поля, що повертаються
Підтримувані формати експорту:
- GeoJSON
- KML
- CSV
- GPX
- DXF
- Shapefile
- SMJSON
Поля результату, що повертаються:
- data
- title
- mapCode
- thumbUrl
Після налаштування Connect Picker надає вашим користувачам доступ до їхніх даних Scribble Maps безпосередньо у вашому застосунку через єдину точку інтеграції.
Пов'язане
Last updated