central_map 0.1.0
central_map: ^0.1.0 copied to clipboard
Kyrgyzstan map for Flutter — a MapLibre widget over central.kg vector tiles with markers, polylines and clusters, plus a REST client for search, routing and isochrones.
central_map (Flutter) #
The central.kg map of Kyrgyzstan for Flutter (iOS + Android): a preconfigured
MapLibre map over our own vector tiles from
map.central.kg, with markers, polylines, zones, clustering and a REST client
(search, routing, isochrones). A wrapper around
maplibre_gl.
Same map in other stacks: @centralkg/map (JS), @centralkg/map-react /
-vue / -angular, @centralkg/map-react-native, CentralMap (Swift, Kotlin).
Russian version of this document: README.ru.md.
Install #
# pubspec.yaml
dependencies:
central_map: ^0.1.0
The native side is set up exactly as for maplibre_gl: Android minSdk 21+,
iOS platform :ios, '13.0', plus location permissions if you enable
myLocationEnabled. See the maplibre_gl docs for platform details.
API key #
The map is served against a key bound to the map service. Generate it in
your account at auth.central.kg -> "API keys": a key issued for one service
does not work on another, so a leaked key cannot be used elsewhere in the
ecosystem.
const config = CentralMapConfig(apiKey: 'ck_map_...');
The key travels as ?key= on tile, style and font requests (the native map
engine cannot attach headers) and as the X-API-Key header on REST calls.
Without a key the backend answers 401 to third-party origins.
Map, markers, polylines #
Flutter uses
LatLng(latitude, longitude)-- the order is lat, lng.
import 'package:central_map/central_map.dart';
CentralMap(
config: const CentralMapConfig(apiKey: 'ck_map_...'),
dark: true,
initialCenter: const LatLng(41.3, 74.6), // center of Kyrgyzstan
initialZoom: 7,
onReady: (c) async {
await c.addMarker(const LatLng(42.87, 74.59), color: Colors.cyan); // Bishkek
await c.addPolyline(
const [LatLng(42.8, 74.5), LatLng(42.9, 74.7)],
color: Colors.indigo, width: 5,
);
// your own icon:
// await c.registerImage('pin', pngBytes);
// await c.addIconMarker(const LatLng(42.87, 74.59), 'pin');
},
)
onReady hands you a CentralMapController:
| Method | What it draws |
|---|---|
addMarker(pos, color, radius, ...) |
round marker, no asset needed |
addIconMarker(pos, imageName, ...) |
marker with your image (see registerImage) |
addPolyline(points, color, width, ...) |
line |
addZone(ring, color, fillOpacity, ...) |
polygon: outline + translucent fill |
addCluster(points, color, radius, maxZoom) |
data-driven clustering with counts |
registerImage(name, bytes) |
registers a PNG for addIconMarker |
moveTo(target, zoom) |
animates the camera |
clear() |
removes markers, lines and symbols |
raw |
the underlying MapLibreMapController -- the full MapLibre API |
Widget options worth knowing: dark, layers (show only these layer keys --
base.* / poi.* / poigroup.*, taxonomy comes from CentralMapApi.poiMeta()),
initialCenter, initialZoom, minZoom, maxZoom, myLocationEnabled,
onTap, styleString (bring your own MapLibre style), and drawZone +
onZoneDraw for freehand zone drawing.
REST API (search, routing, isochrones) #
final api = CentralMapApi(config);
final hits = await api.search('Bishkek', limit: 10); // geocoder
final route = await api.route(const LatLng(42.87, 74.59), // routing
const LatLng(42.89, 74.85), mode: 'car');
final iso = await api.isochrone(const LatLng(42.87, 74.59), // reachability
minutes: [5, 10, 15]);
final meta = await api.poiMeta(); // POI taxonomy
mode for routing: car | foot | bike | scooter. The base URL is
https://map.central.kg/api (override with apiBase / tilesUrl in the
config). Full endpoint reference: https://map.central.kg/docs.
License #
MIT