add: map legend

app/lib/consts.dart

@@ -33,6 +33,8 @@ final titleStyle = GoogleFonts.chakraPetch(
   color: Colors.white70,
   fontWeight: FontWeight.bold,
 );
+
+final smallTextStyle = GoogleFonts.chakraPetch(fontSize: 13, color: textColor);
 final regTextStyle = GoogleFonts.chakraPetch(fontSize: 16, color: textColor);
 final regTextStyleBig = GoogleFonts.chakraPetch(fontSize: 20, color: textColor);
 final chartTextStyle = GoogleFonts.chakraPetch(fontSize: 12, color: textColor);

app/lib/widgets/choropleth_map.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:syncfusion_flutter_core/theme.dart';
 import 'package:syncfusion_flutter_maps/maps.dart';
 
+import '../consts.dart';
 import '../data_classes.dart';
 
 /// ChoroplethMap is a stateful widget that contains a choropleth map.
@@ -50,30 +51,25 @@ class ChoroplethMapState extends State<ChoroplethMap> {
         shapeColorValueMapper: (int index) => widget.subdivisions[index].avgThickness, // NB will later be minThickness
         shapeColorMappers: const [
           MapColorMapper(
-              from: -2,
-              to: -1,
-              color: Color(0xFF8C8C8C),
-              text: '>8'),
-        MapColorMapper(
-            from: 0,
-            to: 4,
-            color: Color(0xFFff0000),
-            text: '{0},{4}'),
-        MapColorMapper(
-            from: 4,
-            to: 6,
-            color: Color(0xffff6a00),
-            text: '6'),
-        MapColorMapper(
-            from: 6,
-            to: 8,
-            color: Color(0xFFb1ff00),
-            text: '8'),
-        MapColorMapper(
-            from: 8,
-            to: 400,
-            color: Color(0xFF00d6ff),
-            text: '>8'),
+              from: 0,
+              to: 4,
+              color: Color(0xFFff0000),
+              text: '{0cm},{4cm}'),
+          MapColorMapper(
+              from: 4,
+              to: 8,
+              color: Color(0xffff6a00),
+              text: '8cm'),
+          MapColorMapper(
+              from: 8,
+              to: 12,
+              color: Color(0xFFb1ff00),
+              text: '12cm'),
+          MapColorMapper(
+              from: 12,
+              to: 400,
+              color: Color(0xFF00d6ff),
+              text: '>15cm'),
           ],
       );
   }
@@ -93,6 +89,12 @@ class ChoroplethMapState extends State<ChoroplethMap> {
             layers: [
               MapShapeLayer(
                 source: dataSource,
+                legend: MapLegend.bar(
+                    MapElement.shape,
+                    position: MapLegendPosition.bottom,
+                    segmentSize: const Size(70.0, 7.0),
+                    textStyle: smallTextStyle,
+                ),
                 zoomPanBehavior: _zoomPanBehavior,
                 strokeColor: Colors.blue.shade50,
                 strokeWidth: 1,