From b117093aff924add46f979aea9a549cbe3145dcb Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 02:18:29 +0300
Subject: [PATCH] feat: Add arrow symbol to polyline in RouteMap component

---
 src/components/map/RouteMap.svelte | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/src/components/map/RouteMap.svelte b/src/components/map/RouteMap.svelte
index 24921ae..e2c922f 100644
--- a/src/components/map/RouteMap.svelte
+++ b/src/components/map/RouteMap.svelte
@@ -39,6 +39,7 @@
 
 			if (shape) {
 				polyline = await createPolyline(shape);
+				addArrowToPolyline();
 				polyline.setMap(map);
 			}
 		}
@@ -54,6 +55,25 @@
 		}
 	}
 
+	function addArrowToPolyline() {
+		const arrowSymbol = {
+			path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
+			scale: 2,
+			strokeColor: '#FF0000',
+			strokeWeight: 3
+		};
+
+		polyline.setOptions({
+			icons: [
+				{
+					icon: arrowSymbol,
+					offset: '100%',
+					repeat: '50px'
+				}
+			]
+		});
+	}
+
 	function addStopMarker(stopTime, stop) {
 		const marker = new google.maps.Marker({
 			position: { lat: stop.lat, lng: stop.lon },