Arcgis Maps SDK for Flutter
Setup
Add the package to your app
In your app's pubspec.yaml dependencies, add:
dependencies:
arcgis_map_sdk: ^0.8.0
Android only setup
(Android) In <app>/android/app/proguard-rules.pro
add:
-keep class dev.fluttercommunity.arcgis_map_sdk.** { *; }
Use ArcgisMap
Integrate the ArcgisMap
Widget
import 'package:arcgis_map_sdk/arcgis_map_sdk.dart';
import 'package:arcgis_map_sdk_platform_interface/arcgis_map_sdk_platform_interface.dart';
@override
Widget build(BuildContext context) {
return Scaffold(
body: ArcgisMap(
apiKey: arcGisApiKey,
initialCenter: const LatLng(51.16, 10.45),
zoom: 8,
mapStyle: MapStyle.twoD,
basemap: BaseMap.arcgisChartedTerritory,
onMapCreated: (controller) async {
const pinLayerId = 'pins';
await controller.addGraphic(
layerId: pinLayerId,
graphic: PointGraphic(
latitude: 51.091062,
longitude: 6.880812,
attributes: Attributes({
'id': 'phntm',
'name': 'PHNTM GmbH',
'family': 'Office',
}),
symbol: const PictureMarkerSymbol(
webUri:
"https://github.com/fluttercommunity/arcgis_map/assets/1096485/94178dba-5bb8-4f1e-a160-31bfe4c93d17",
mobileUri:
"https://github.com/fluttercommunity/arcgis_map/assets/1096485/94178dba-5bb8-4f1e-a160-31bfe4c93d17",
width: 314 / 2,
height: 120 / 2,
),
),
);
await controller.addGraphic(
layerId: pinLayerId,
graphic: PointGraphic(
latitude: 48.1234963,
longitude: 11.5910182,
attributes: Attributes({
'id': 'tapped',
'name': 'Tapped UG',
'family': 'Office',
}),
symbol: const PictureMarkerSymbol(
webUri:
"https://github.com/fluttercommunity/arcgis_map/assets/1096485/c84c524c-78b7-46e5-9bf1-a3a91853b2cf",
mobileUri:
"https://github.com/fluttercommunity/arcgis_map/assets/1096485/c84c524c-78b7-46e5-9bf1-a3a91853b2cf",
width: 312 / 2,
height: 111 / 2,
),
),
);
},
),
);
}
Checkout the example app example/lib/main.dart
for more details.
Platform support
Feature | web | ios | android |
---|---|---|---|
3D Map | ✅ | ||
Vector tiles | ✅ | ✅ | ✅ |
centerPosition | ✅ | ✅ | ✅ |
rotation | ✅ | ✅ | ✅ |
setInteraction | ✅ | ✅ | ✅ |
addViewPadding | ✅ | ✅ | ✅ |
toggleBaseMap | ✅ | ✅ | ✅ |
moveCamera | ✅ | ✅ | ✅ |
zoomIn | ✅ | ✅ | ✅ |
zoomOut | ✅ | ✅ | ✅ |
getZoom | ✅ | ✅ | ✅ |
addGraphic | ✅ | ✅ | ✅ |
removeGraphic | ✅ | ✅ | ✅ |
updateGraphicSymbol | ✅ | ||
getGraphicsInView | ✅ | ||
getVisibleGraphicIds | ✅ | ||
FeatureLayer | ✅ | ||
updateFeatureLayer | ✅ | ||
destroyLayer | ✅ | ||
mouse cursor | ✅ | ||
visibleGraphics | ✅ | ||
getBounds | ✅ | ||
attributionText | ✅ | ||
onClickListener | ✅ | ||
polygonContainsPoint | ✅ |
Development
- Clone the repository.
cd
into the project directory.- Run
./am deps
and ensure it completes without errors.
The project has its own collection of scripts wrapped into one convenient command called am
.
Run ./am -h
to explore what the command can do.
This uses the cli tool https://github.com/phntmxyz/sidekick.