From 38432a18c11dbf620659d3883ccb17210fac6d93 Mon Sep 17 00:00:00 2001
From: Eli Ribble <eli@gleipnir.technology>
Date: Fri, 13 Feb 2026 19:20:01 +0000
Subject: [PATCH] Show precise html marker on stadia test

---
 html/template/sync/stadia.html | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/html/template/sync/stadia.html b/html/template/sync/stadia.html
index be8fad42..5b42a5b4 100644
--- a/html/template/sync/stadia.html
+++ b/html/template/sync/stadia.html
@@ -30,10 +30,27 @@
 		<script type="text/javascript">
 			var map = new maplibregl.Map({
 				container: "map",
-				style: "https://tiles.stadiamaps.com/styles/alidade_smooth.json", // Style URL; see our documentation for more options
+				style: "https://tiles.stadiamaps.com/styles/alidade_satellite.json", // Style URL; see our documentation for more options
 				center: [12, 53], // Initial focus coordinate
 				zoom: 4,
 			});
+			map.on("load", () => {
+				//let coords = [-119.3444741, 36.3260431 ];
+				let coords = [-119.34384512198031, 36.3260431000042];
+				map.jumpTo({
+					center: coords,
+					zoom: 19,
+				});
+				const marker = new maplibregl.Marker({
+					color: "#FF0000",
+					draggable: true,
+				})
+					.setLngLat(coords)
+					.addTo(map);
+				marker.on("dragend", (e) => {
+					console.log("Marker moved to", e);
+				});
+			});
 
 			// MapLibre GL JS does not handle RTL text by default,
 			// so we recommend adding this dependency to fully support RTL rendering if your style includes RTL text