Ваш мобільний додаток використовує Mapbox, але після оновлення SDK до v11 карта перестала працювати: MapboxMapOptions застарів, маркери не відображаються, а офлайн-завантаження падає з помилкою TileRegionLoadError. Ми — команда мобільних розробників з п'ятирічним досвідом інтеграції картографічних SDK. За цей час виконали понад 150 проектів по картах — від доставки до логістики. Пропонуємо готове рішення під ключ: оновимо код, налаштуємо офлайн та гарантуємо продуктивність 60 FPS навіть при 10 000+ точках. Інтеграція Mapbox SDK — наша спеціалізація. Зв'яжіться з нами для безкоштовного аудиту поточної реалізації.
Як інтегрувати Mapbox SDK у мобільний додаток?
Інтеграція Mapbox SDK v11 починається з налаштування access token. Далі створюєте MapView у layout, підключаєте стиль через MapInitOptions. Базова карта з кастомним стилем з Mapbox Studio готова за годину. Якщо ви переходите з v10 — дивіться розділ міграції. Mapbox SDK забезпечує високу продуктивність: на Android використовує Vulkan, на iOS — Metal, що дає 60 FPS навіть на пристроях середньої потужності. При інтеграції Mapbox SDK з тисячами точок важливо обрати правильний підхід до рендерингу.
| Тип рендерингу | Продуктивність (10K точок) | Пам'ять | Гнучкість кастомізації |
|---|---|---|---|
| PointAnnotation | ~30 FPS | Висока | Висока |
| GeoJSON шар | ~60 FPS | Середня | Середня |
Як мігрувати з v10 на v11?
Mapbox v11 — це новий SDK з іншим API. Основні зміни: MapboxMap замість MapboxMapOptions, ViewAnnotation замість MarkerView, PointAnnotationManager замість SymbolManager. Ми підготували міграційний чек-лист, щоб не пропустити жодної деталі. Наприклад, всі addMarker() потрібно замінити на PointAnnotationManager. Без цього маркери не відобразяться. При міграції ми також оновлюємо обробку подій камери та переносимо offline-логіку на TileStore.
Міграційні зміни v10 → v11 — інтеграція mapbox sdk
| Компонент v10 | Компонент v11 |
|---|---|
MapboxMapOptions |
MapView з MapInitOptions |
MarkerView |
ViewAnnotation |
SymbolManager |
PointAnnotationManager |
addMarker() |
PointAnnotationManager.annotations |
Style.Builder |
StyleURI + style.loadStyle() |
Інтеграція Mapbox SDK: продуктивність з тисячами точок
Для 10 000+ точок PointAnnotationManager просідає по FPS. Рішення — GeoJSON-шар: додаємо джерело даних і рендеримо через SymbolLayer або CircleLayer. Це працює в рази швидше. Нижче приклад для Android. При великій кількості точок також вмикаємо кластеризацію через ClusterLayer — це знижує навантаження на рендеринг. За нашими вимірами, кластеризація зменшує кількість елементів, що відмальовуються, на 80%, що дозволяє тримати 60 FPS при 50 000 точках.
mapView.mapboxMap.loadStyle(Style.MAPBOX_STREETS) { style -> style.addSource( GeoJsonSource.Builder("locations-source") .data(""" { "type": "FeatureCollection", "features": [ { "type": "Feature", "geometry": { "type": "Point", "coordinates": [37.6173, 55.7558] }, "properties": { "name": "Точка А" } } ] } """.trimIndent()) .build() ) style.addLayer( SymbolLayer("locations-layer", "locations-source").apply { iconImage("custom-icon") iconSize(1.0) textField(get("name")) textOffset(listOf(0.0, 1.5)) } ) } Рішення для офлайн-карт
Налаштовуємо завантаження регіону з контролем зума та прогресу. Код нижче — завантаження центру Києва з зумом 10-16. TileStore забезпечує надійне кешування та швидкий доступ до тайлів. При помилках автоматично повторюємо завантаження. За нашими даними, офлайн-тайли займають в середньому 50-300 МБ на регіон залежно від зума та площі.
val offlineManager = OfflineManager() val tileStore = TileStore.create() val tilesetDescriptor = offlineManager.createTilesetDescriptor( TilesetDescriptorOptions.Builder() .styleURI(Style.MAPBOX_STREETS) .minZoom(10) .maxZoom(16) .build() ) val tileRegionLoadOptions = TileRegionLoadOptions.Builder() .geometry(Point.fromLngLat(30.5234, 50.4501)) .descriptors(listOf(tilesetDescriptor)) .build() tileStore.loadTileRegion("kyiv-center", tileRegionLoadOptions, { progress -> Log.d("Mapbox", "Downloaded: ${progress.completedResourceCount}/${progress.requiredResourceCount}") }, { result -> result.fold({ region -> Log.d("Mapbox", "Done: ${region.id}") }, { error -> }) }) Типові помилки при інтеграції Mapbox SDK
- Неправильний access token (перевірте scope — він повинен включати "Maps" та "Offline").
- Відсутність дозволів на місцезнаходження для точного позиціонування.
- Помилки стилю: посилання на відсутні спрайти або іконки в Mapbox Studio.
- Проблеми з кешуванням: якщо не очистити старий кеш після міграції, офлайн може не працювати.
Процес роботи
- Аналіз — вивчаємо поточну реалізацію, визначаємо необхідні зміни. Перевіряємо версію SDK, стилі, джерела даних.
- Проектування — обираємо версію SDK (рекомендуємо v11), стиль, джерела даних, плануємо офлайн-регіони.
- Реалізація — кодинг на Swift/Kotlin, налаштування стилів у Mapbox Studio, тестовий access token.
- Тестування — перевірка на пристроях, навантажувальне тестування офлайну, налагодження через Android Studio / Xcode.
- Деплой — оновлюємо provisioning profile, публікуємо в сторах.
Терміни та вартість
Базова карта з кастомним стилем — 1 день. Додавання GeoJSON-шарів та офлайну — 2–3 дні. Складні проекти з кластеризацією та кастомною навігацією — до тижня. Вартість розраховується індивідуально після швидкої оцінки. При цьому ви економите час на самостійне вивчення API та налагодження — за нашим досвідом, це до 40% часу розробки.
Що входить у роботу
- Вихідний код з коментарями та архітектурними поясненнями.
- Документація з налаштування access token, збірки та деплою.
- Доступ до стилів у Mapbox Studio.
- Підтримка при публікації в App Store та Google Play.
- Гарантія стабільної роботи протягом місяця.
Оцінимо ваш проект за 1 день — зв'яжіться з нами для консультації. Отримайте безкоштовний аудит поточної реалізації та рекомендації з міграції. А ще ми даємо розширену гарантію на інтеграцію Mapbox SDK — повна підтримка протягом 30 днів після здачі. Замовте інтеграцію вже сьогодні.