Lift to flutter_map v7.0.2

example/android/app/build.gradle

@@ -35,7 +35,7 @@ android {
     defaultConfig {
         // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
         applicationId "com.example.flutter_map_supercluster_example"
-        minSdkVersion 16
+        minSdkVersion flutter.minSdkVersion
         targetSdkVersion 30
         versionCode flutterVersionCode.toInteger()
         versionName flutterVersionName

example/devtools_options.yaml

@@ -0,0 +1 @@
+extensions:

example/lib/basic_example.dart

@@ -0,0 +1,69 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:flutter_map/flutter_map.dart';
+import 'package:flutter_map_supercluster/flutter_map_supercluster.dart';
+import 'package:flutter_map_supercluster_example/drawer.dart';
+import 'package:flutter_map_supercluster_example/main.dart';
+import 'package:latlong2/latlong.dart';
+
+class BasicExamplePage extends StatelessWidget {
+  static const String route = 'basicExamplePage';
+
+  static const _totalMarkers = 3000;
+  static final _random = Random(42);
+  static const _initialCenter = LatLng(42.0, 10.0);
+  static final _markers = List<Marker>.generate(
+    _totalMarkers,
+    (_) => Marker(
+      point: LatLng(
+        _random.nextDouble() * 3 - 1.5 + _initialCenter.latitude,
+        _random.nextDouble() * 3 - 1.5 + _initialCenter.longitude,
+      ),
+      child: const Icon(Icons.location_on),
+    ),
+  );
+
+  const BasicExamplePage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(title: const Text('Basic Example')),
+      drawer: buildDrawer(context, route),
+      body: FlutterMap(
+        options: const MapOptions(
+          initialCenter: _initialCenter,
+          initialZoom: 8,
+          maxZoom: 19,
+        ),
+        children: <Widget>[
+          TileLayer(
+            urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
+            userAgentPackageName: tileLayerPackageName,
+          ),
+          SuperclusterLayer.immutable(
+            initialMarkers: _markers,
+            indexBuilder: IndexBuilders.computeWithOriginalMarkers,
+            clusterWidgetSize: const Size(40, 40),
+            maxClusterRadius: 120,
+            clusterAlignment: Alignment.center,
+            builder: (context, position, markerCount, extraClusterData) {
+              return Container(
+                decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(20.0),
+                    color: Colors.blue),
+                child: Center(
+                  child: Text(
+                    markerCount.toString(),
+                    style: const TextStyle(color: Colors.white),
+                  ),
+                ),
+              );
+            },
+          ),
+        ],
+      ),
+    );
+  }
+}

example/lib/too_close_to_uncluster_page.dart → example/lib/cluster_splaying_page.dart

@@ -1,62 +1,59 @@
 import 'dart:math';
 
 import 'package:flutter/material.dart';
-import 'package:flutter_map/plugin_api.dart';
+import 'package:flutter_map/flutter_map.dart';
 import 'package:flutter_map_animations/flutter_map_animations.dart';
 import 'package:flutter_map_supercluster/flutter_map_supercluster.dart';
 import 'package:flutter_map_supercluster_example/drawer.dart';
+import 'package:flutter_map_supercluster_example/main.dart';
 import 'package:latlong2/latlong.dart';
 
-class TooCloseToUnclusterPage extends StatefulWidget {
-  static const String route = 'tooCloseToUnclusterPage';
+class ClusterSplayingPage extends StatefulWidget {
+  static const String route = 'clusterSplayingPage';
 
-  const TooCloseToUnclusterPage({Key? key}) : super(key: key);
+  const ClusterSplayingPage({super.key});
 
   @override
-  State<TooCloseToUnclusterPage> createState() =>
-      _TooCloseToUnclusterPageState();
+  State<ClusterSplayingPage> createState() => _ClusterSplayingPageState();
 }
 
-class _TooCloseToUnclusterPageState extends State<TooCloseToUnclusterPage>
+class _ClusterSplayingPageState extends State<ClusterSplayingPage>
     with TickerProviderStateMixin {
   late final SuperclusterImmutableController _superclusterController;
   late final AnimatedMapController _animatedMapController;
 
-  static final points = [
-    const LatLng(51.4001, -0.08001),
-    const LatLng(51.4003, -0.08003),
-    const LatLng(51.4005, -0.08005),
-    const LatLng(51.4006, -0.08006),
-    const LatLng(51.4009, -0.08009),
-    const LatLng(51.5, -0.09),
-    const LatLng(51.5, -0.09),
-    const LatLng(51.5, -0.09),
-    const LatLng(51.5, -0.09),
-    const LatLng(51.5, -0.09),
-    const LatLng(51.59, -0.099),
+  static const points = [
+    LatLng(51.4001, -0.08001),
+    LatLng(51.4003, -0.08003),
+    LatLng(51.4005, -0.08005),
+    LatLng(51.4006, -0.08006),
+    LatLng(51.4009, -0.08009),
+    LatLng(51.5, -0.09),
+    LatLng(51.5, -0.09),
+    LatLng(51.5, -0.09),
+    LatLng(51.5, -0.09),
+    LatLng(51.5, -0.09),
+    LatLng(51.59, -0.099),
   ];
-  late List<Marker> markers;
+  static final List<Marker> markers = points
+      .map(
+        (point) => Marker(
+          alignment: Alignment.topCenter,
+          height: 30,
+          width: 30,
+          point: point,
+          rotate: true,
+          child: const Icon(Icons.pin_drop),
+        ),
+      )
+      .toList();
 
   @override
   void initState() {
     super.initState();
 
     _superclusterController = SuperclusterImmutableController();
     _animatedMapController = AnimatedMapController(vsync: this);
-
-    markers = points
-        .map(
-          (point) => Marker(
-            anchorPos: AnchorPos.align(AnchorAlign.top),
-            rotateAlignment: AnchorAlign.top.rotationAlignment,
-            height: 30,
-            width: 30,
-            point: point,
-            rotate: true,
-            builder: (ctx) => const Icon(Icons.pin_drop),
-          ),
-        )
-        .toList();
   }
 
   @override
@@ -70,7 +67,7 @@ class _TooCloseToUnclusterPageState extends State<TooCloseToUnclusterPage>
   Widget build(BuildContext context) {
     return PopupScope(
       child: Scaffold(
-        appBar: AppBar(title: const Text('Too close to uncluster page')),
+        appBar: AppBar(title: const Text('Cluster Splaying')),
         floatingActionButton: Column(
           mainAxisAlignment: MainAxisAlignment.end,
           children: [
@@ -87,21 +84,21 @@ class _TooCloseToUnclusterPageState extends State<TooCloseToUnclusterPage>
             ),
           ],
         ),
-        drawer: buildDrawer(context, TooCloseToUnclusterPage.route),
+        drawer: buildDrawer(context, ClusterSplayingPage.route),
         body: FlutterMap(
           mapController: _animatedMapController.mapController,
           options: MapOptions(
-            center: const LatLng(51.4931, -0.1003),
-            zoom: 10,
-            maxZoom: 15,
+            initialCenter: const LatLng(51.4931, -0.1003),
+            initialZoom: 10,
+            maxZoom: 16,
             onTap: (_, __) {
               _superclusterController.collapseSplayedClusters();
             },
           ),
           children: <Widget>[
             TileLayer(
-              urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
-              subdomains: const ['a', 'b', 'c'],
+              urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
+              userAgentPackageName: tileLayerPackageName,
             ),
             SuperclusterLayer.immutable(
               initialMarkers: markers,
@@ -112,7 +109,7 @@ class _TooCloseToUnclusterPageState extends State<TooCloseToUnclusterPage>
                 zoom: zoom,
               ),
               clusterWidgetSize: const Size(40, 40),
-              anchor: AnchorPos.align(AnchorAlign.center),
+              clusterAlignment: Alignment.center,
               popupOptions: PopupOptions(
                 selectedMarkerBuilder: (context, marker) => const Icon(
                   Icons.pin_drop,

example/lib/custom_cluster_marker_page.dart

@@ -1,30 +1,31 @@
 import 'dart:math';
 
 import 'package:flutter/material.dart';
-import 'package:flutter_map/plugin_api.dart';
+import 'package:flutter_map/flutter_map.dart';
 import 'package:flutter_map_supercluster/flutter_map_supercluster.dart';
 import 'package:flutter_map_supercluster_example/drawer.dart';
+import 'package:flutter_map_supercluster_example/main.dart';
 import 'package:latlong2/latlong.dart';
 
 class CustomClusterMarkerPage extends StatelessWidget {
   static const String route = 'customClusterMarkerPage';
 
-  const CustomClusterMarkerPage({Key? key}) : super(key: key);
+  const CustomClusterMarkerPage({super.key});
 
   // Initialise randomly generated Markers
   static final _random = Random(42);
   static const _initialCenter = LatLng(42.0, 10.0);
   static final _markers = List<CustomMarker>.generate(
     3000,
     (_) => CustomMarker(
-      builder: (context) => const Icon(Icons.location_on),
       point: LatLng(
         _random.nextDouble() * 3 - 1.5 + _initialCenter.latitude,
         _random.nextDouble() * 3 - 1.5 + _initialCenter.longitude,
       ),
       greenCount: _random.nextInt(10),
       blueCount: _random.nextInt(10),
       purpleCount: _random.nextInt(10),
+      child: const Icon(Icons.location_on),
     ),
   );
 
@@ -34,13 +35,14 @@ class CustomClusterMarkerPage extends StatelessWidget {
       appBar: AppBar(title: const Text('Custom Cluster Marker')),
       drawer: buildDrawer(context, CustomClusterMarkerPage.route),
       body: FlutterMap(
-        options: MapOptions(
-          center: _initialCenter,
-          zoom: 8,
+        options: const MapOptions(
+          initialCenter: _initialCenter,
+          initialZoom: 8,
         ),
         children: [
           TileLayer(
             urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
+            userAgentPackageName: tileLayerPackageName,
           ),
           SuperclusterLayer.immutable(
             // Replaces MarkerLayer
@@ -91,9 +93,9 @@ class CustomMarker extends Marker {
   final int blueCount;
   final int purpleCount;
 
-  CustomMarker({
+  const CustomMarker({
     required super.point,
-    required super.builder,
+    required super.child,
     required this.greenCount,
     required this.blueCount,
     required this.purpleCount,

example/lib/drawer.dart

@@ -1,9 +1,10 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_map_supercluster_example/cluster_splaying_page.dart';
 import 'package:flutter_map_supercluster_example/custom_cluster_marker_page.dart';
-import 'package:flutter_map_supercluster_example/immutable_clustering_page.dart';
-import 'package:flutter_map_supercluster_example/mutable_clustering_page.dart';
 import 'package:flutter_map_supercluster_example/normal_and_clustered_markers_with_popups_page.dart';
-import 'package:flutter_map_supercluster_example/too_close_to_uncluster_page.dart';
+
+import 'basic_example.dart';
+import 'mutable_clustering_page.dart';
 
 Widget _buildMenuItem(
     BuildContext context, Widget title, String routeName, String currentRoute) {
@@ -33,26 +34,26 @@ Drawer buildDrawer(BuildContext context, String currentRoute) {
         ),
         _buildMenuItem(
           context,
-          const Text('Clustering (mutable)'),
-          MutableClusteringPage.route,
+          const Text('Basic Example'),
+          BasicExamplePage.route,
           currentRoute,
         ),
         _buildMenuItem(
           context,
-          const Text('Clustering Many Markers (Immutable)'),
-          ClusteringManyMarkersPage.route,
+          const Text('Mutable Clustering'),
+          MutableClustersPage.route,
           currentRoute,
         ),
         _buildMenuItem(
           context,
-          const Text('Too close to uncluster'),
-          TooCloseToUnclusterPage.route,
+          const Text('Cluster Splaying'),
+          ClusterSplayingPage.route,
           currentRoute,
         ),
         _buildMenuItem(
           context,
           const Text('Normal and Clustered Markers With Popups'),
-          NormalAndClusteredMarkersWithPopups.route,
+          NormalAndClusteredMarkersWithPopupsPage.route,
           currentRoute,
         ),
         _buildMenuItem(

example/lib/font/accurate_map_icons.dart

@@ -1,18 +1,3 @@
-/// Flutter icons AccurateMapIcon
-/// Copyright (C) 2021 by original authors @ fluttericon.com, fontello.com
-/// This font was generated by FlutterIcon.com, which is derived from Fontello.
-///
-/// To use this font, place it in your fonts/ directory and include the
-/// following in your pubspec.yaml
-///
-/// flutter:
-///   fonts:
-///    - family:  AccurateMapIcon
-///      fonts:
-///       - asset: fonts/AccurateMapIcon.ttf
-///
-///
-///
 import 'package:flutter/widgets.dart';
 
 class AccurateMapIcons {