arcgis_map_sdk 0.8.0

Esri ArcGIS map for Flutter for Web, iOS and Android platforms

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

1. Clone the repository.
2. cd into the project directory.
3. 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.