diff --git a/app/lib/main.dart b/app/lib/main.dart
index a64af293a57159850be44442673a597504a1d9b8..bff144024437ae2f42b7df9fecce02ce0b1142c9 100644
--- a/app/lib/main.dart
+++ b/app/lib/main.dart
@@ -4,6 +4,7 @@ import 'package:latlong2/latlong.dart'; // Import LatLng class from the latlong
 import 'dart:async';
 import 'dart:io';
 
+
 const String port = "8443";
 const String serverURI = "https://127.0.0.1:$port/";
 const String mapEndpoint = "update_map";
@@ -50,12 +51,21 @@ class DefaultPage extends StatefulWidget {
   _DefaultPageState createState() => _DefaultPageState();
 }
 
+class MarkerData {
+  final LatLng location;
+  final double size;
+  final Color color;
+
+  MarkerData({required this.location, required this.size, required this.color});
+}
+
 class _DefaultPageState extends State<DefaultPage> {
   late Timer _timer;
-  final List<LatLng> locations = [
-    LatLng(60.8366, 10.8171),
-    LatLng(60.7366, 10.8471),
-    LatLng(60.7266, 10.9771),
+
+  final List<MarkerData> markerList = [
+    MarkerData(location: LatLng(60.7266, 10.9771), size: 50.0, color: Colors.blue),
+    MarkerData(location: LatLng(60.8366, 10.8171), size: 70.0, color: Colors.red),
+    MarkerData(location: LatLng(60.7366, 10.8471),  size: 60.0, color: Colors.green),
   ];
 
   // Timer initializer
@@ -103,26 +113,26 @@ class _DefaultPageState extends State<DefaultPage> {
                 color: Colors.blue,
                 child: FlutterMap(
                   options: MapOptions(
-                    center: LatLng(60.7666, 10.8471), // Initial center of the map (latitude and longitude)
-                    zoom: 9.0, // Initial zoom level of the map
+                    center: LatLng(60.7666, 10.8471),
+                    zoom: 9.0,
                   ),
-                  children: [ // Add layers directly as children
+                  children: [
                     TileLayer(
                         urlTemplate: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
                         subdomains: ['a', 'b', 'c'],
                       ),
-                    MarkerLayer(
-                      markers: locations
+                    MarkerLayer( // Dynamically allocate markers based on a list
+                      markers: markerList
                           .map(
-                            (LatLng location) => Marker(
-                          width: 80.0,
-                          height: 80.0,
-                          point: location,
+                            (MarkerData markerData) => Marker(
+                          width: markerData.size,
+                          height: markerData.size,
+                          point: markerData.location,
                           builder: (ctx) => Container(
                             child: Icon(
                               Icons.location_on,
-                              color: Colors.blue,
-                              size: 50.0,
+                              color: markerData.color,
+                              size: markerData.size,
                             ),
                           ),
                         ),