Вы здесь: Разработчикам приложений

Запросить демо

01 — Разработчикам приложений

Встройте карту мероприятия в своё приложение

Если вы делаете приложение мероприятия, карту писать не нужно. Встройте карту STUMaps в WebView, общайтесь с ней через небольшой JavaScript-мост и открывайте её глубокими ссылками.

02 — WebView

Встраивание в WebView за четыре шага

  1. Откройте адрес карты

    Загрузите адрес карты мероприятия в WKWebView (iOS), WebView (Android) или react-native-webview. Передайте ?lang=, чтобы язык совпадал с приложением.

  2. Зарегистрируйте обработчик

    Добавьте message handler с именем из конфигурации карты (iOS) или JavaScript-интерфейс (Android); React Native получает onMessage.

  3. Дождитесь «ready»

    Карта отправляет ready с версией моста, когда готова принимать команды.

  4. Вызывайте и слушайте

    Открывайте места и стройте маршруты из нативных экранов; реагируйте на события карты.

03 — JavaScript

JavaScript-мост

Карта публикует в window объект с тремя командами. Каждая возвращает false, если место или язык неизвестны.

const map = window.NoctaraRunMap;      // name from the map config
map.open('water-5');                    // true | false
map.route('tram-wawel-01', 'start');
map.setLang('pl');

// iOS: webkit.messageHandlers[...]  Android: JavaScript interface
// React Native: ReactNativeWebView.postMessage
{ source: 'noctara-run-map', type: 'route_built', payload: { from, to, meters, seconds, floors } }

События в приложение: ready, poi_opened, route_built (с метрами, секундами и этажами), share_image и share_link — приложение может показать свой диалог «Поделиться».

05 — WKWebView · Android WebView

Честные ограничения

Три вещи, которые WebView не умеет сам, — и как мы с ними работаем.

  • Web push в WebView не работает

    Пуш-уведомления отправляет ваше приложение. Карта даёт API или вебхук, через которые ваш пуш-сервис отправит оповещения; это настраивается в каждом проекте.

  • Офлайн в iOS WKWebView требует App-Bound Domains

    Service worker, благодаря которому карта работает офлайн, запускается в WKWebView только для доменов, указанных в приложении как App-Bound Domains. Без них карта работает онлайн.

  • Геолокацию и камеру разрешает приложение

    WebView может использовать геолокацию или камеру (для QR-кодов), только если у приложения есть разрешение и оно передаёт его в WebView.

Карта мероприятия в приложении: чек-лист WebView

06 — FAQ

Вопросы

Нужен ли SDK?

Нет. Это веб-страница; мост — обычные JavaScript-сообщения между страницей и приложением.

Карта может выглядеть как наше приложение?

Цвета светлой и тёмной темы, шрифты, логотип и формулировки задаются в конфигурации карты.

А если приложение на React Native?

Используйте react-native-webview: карта отправляет события в ReactNativeWebView, а мост вызывается через injectJavaScript.

Финиш

Есть площадка, которой нужна карта?

Пришлите план и даты — мы ответим, что потребуется для карты вашей площадки.

Запросить демо Узнать стоимость