From 63290baeb1bbc708737929d38cad179a59e882da Mon Sep 17 00:00:00 2001
From: Sara <sarasdj@stud.ntnu.no>
Date: Tue, 7 May 2024 11:54:39 +0200
Subject: [PATCH] add: map legend
---
app/lib/consts.dart | 2 ++
app/lib/widgets/choropleth_map.dart | 50 +++++++++++++++--------------
2 files changed, 28 insertions(+), 24 deletions(-)
diff --git a/app/lib/consts.dart b/app/lib/consts.dart
index dae3e59a..371b4559 100644
--- a/app/lib/consts.dart
+++ b/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);
diff --git a/app/lib/widgets/choropleth_map.dart b/app/lib/widgets/choropleth_map.dart
index b4869d90..82921320 100644
--- a/app/lib/widgets/choropleth_map.dart
+++ b/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,
--
GitLab