Update index.html

index.html

@@ -61,13 +61,22 @@
         // Load the KML file
         omnivore.kml(proxyKmlUrl).addTo(map);
 
-        // Optionally, handle any errors
-        omnivore.kml(proxyKmlUrl).on('ready', function() {
-            console.log('KML loaded successfully');
-        }).on('error', function() {
-            alert('Failed to load KML');
-        });
 
+// Load the KML file and customize the marker icon
+        var kmlLayer = omnivore.kml(proxyKmlUrl, null, L.geoJSON(null, {
+            pointToLayer: function (feature, latlng) {
+                return L.marker(latlng, {
+                    icon: L.icon({
+                        iconUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/images/marker-icon-2x-red.png',
+                        iconSize: [25, 41], // size of the icon
+                        iconAnchor: [12, 41], // point of the icon which will correspond to marker's location
+                        popupAnchor: [1, -34], // point from which the popup should open relative to the iconAnchor
+                        shadowSize: [41, 41] // size of the shadow
+                    })
+                });
+            }
+        })).addTo(map);
+        
         // GPX URL - Change 'croton.gpx' to the filename of your GPX file
         var gpxUrl = 'croton.gpx';