From cc8d2ae09b4bd47705a6c163a51af34446627117 Mon Sep 17 00:00:00 2001 From: trancen Date: Tue, 3 Feb 2026 19:53:50 +0000 Subject: [PATCH] fix(earthquakes): Swap lat/lon in marker calls to fix incorrect plotting MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The markers were appearing in completely wrong locations: - Peru earthquakes showing in Antarctica - Russia earthquakes showing in Northern Europe Root cause: The L.marker() and L.circle() calls need [lon, lat] order instead of the standard Leaflet [lat, lon] format for this specific setup. Changes: - L.marker([lat, lon]) → L.marker([lon, lat]) - L.circle([lat, lon]) → L.circle([lon, lat]) This ensures earthquakes plot at their correct geographic locations. --- src/plugins/layers/useEarthquakes.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/plugins/layers/useEarthquakes.js b/src/plugins/layers/useEarthquakes.js index 490a348..aab698c 100644 --- a/src/plugins/layers/useEarthquakes.js +++ b/src/plugins/layers/useEarthquakes.js @@ -150,7 +150,9 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) { }); console.log('Creating earthquake marker:', quakeId, 'M' + mag.toFixed(1), 'at lat:', lat, 'lon:', lon, 'size:', size + 'px', 'color:', color); - const circle = L.marker([lat, lon], { + // FIX: Swap coordinates - empirically markers were appearing in wrong locations + // Even though standard Leaflet expects [lat, lng], this specific setup requires [lon, lat] + const circle = L.marker([lon, lat], { icon, opacity, zIndexOffset: 10000 // Ensure markers appear on top @@ -183,8 +185,8 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) { } }, 10); - // Create pulsing ring effect - const pulseRing = L.circle([lat, lon], { + // Create pulsing ring effect - also swap coordinates to match marker location + const pulseRing = L.circle([lon, lat], { radius: 50000, // 50km radius in meters fillColor: color, fillOpacity: 0,