Начните здесь

1. Подготовьте карту и ключ

В Studio создайте карту, опубликуйте её и скопируйте Style URL из окна «Подключить». В разделе ключей создайте ключ доступа к этой карте.

Для карты нужен доступ map-tiles, для поиска — places, для маршрутов — routing. URL стиля имеет вид https://api.umap.kz/api/platform/styles/MAP_ID/style.json.

2. Установите пакет

npm install @umap-llc/map-react

3. Откройте первую карту

JavaScript: задайте контейнеру высоту и position: relative. Flutter: вставьте UMapView в Scaffold или SizedBox с ограниченным размером.

Flutter: передайте параметры запуска через --dart-define=UMAP_STYLE_URL=… и --dart-define=UMAP_ACCESS_TOKEN=…. Методы камеры доступны после onReady; свои слои добавляйте после onLoad.

import { createMap } from "@umap-llc/map-react";
// HTML: <div id="map" style="height:480px;position:relative"></div>
const map = createMap({
  container: "map",
  style: "YOUR_STYLE_URL",
  accessToken: "YOUR_ACCESS_TOKEN",
  center: [71.43045, 51.12829],
  zoom: 15,
});
map.on("load", () => console.log("Карта готова"));
map.on("error", ({ error }) => console.error(error.message));
// При закрытии страницы вашего SPA:
// map.remove();

4. Выберите следующую задачу