edit: blaue Punkte statt icons am Beginn und Ende des Linie

components/MapComponent.js

@@ -2082,23 +2082,25 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         // Create a polyline for each set of coordinates
         const polyline = L.polyline(line, { color: "red" }).addTo(map);
 
-        // Add start marker
+        // Add start circle marker
-        const startIcon = new L.Icon({
+        L.circleMarker(line[0], {
-          iconUrl: "/path/to/start-icon.png",
+          radius: 5,
-          iconSize: [25, 41],
+          fillColor: "#0000FF",
-          iconAnchor: [12, 41],
+          color: "#0000FF",
-          popupAnchor: [1, -34],
+          weight: 1,
-        });
+          opacity: 1,
-        L.marker(line[0], { icon: startIcon }).addTo(map);
+          fillOpacity: 0.8,
+        }).addTo(map);
 
-        // Add end marker
+        // Add end circle marker
-        const endIcon = new L.Icon({
+        L.circleMarker(line[line.length - 1], {
-          iconUrl: "/path/to/end-icon.png",
+          radius: 5,
-          iconSize: [25, 41],
+          fillColor: "#0000FF",
-          iconAnchor: [12, 41],
+          color: "#0000FF",
-          popupAnchor: [1, -34],
+          weight: 1,
-        });
+          opacity: 1,
-        L.marker(line[line.length - 1], { icon: endIcon }).addTo(map);
+          fillOpacity: 0.8,
+        }).addTo(map);
       }
     });
   }, [map, linePositions]);