diff --git a/src/plugins/layers/useLightning.js b/src/plugins/layers/useLightning.js index d14ea96..ad2f994 100644 --- a/src/plugins/layers/useLightning.js +++ b/src/plugins/layers/useLightning.js @@ -107,6 +107,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) { // For now, generate simulated data const strikes = generateSimulatedStrikes(50); + console.log('[Lightning] Generated', strikes.length, 'strikes at', new Date().toLocaleTimeString()); setLightningData(strikes); } catch (err) { console.error('Lightning data fetch error:', err); @@ -293,6 +294,8 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) { const positiveStrikes = lightningData.filter(s => s.polarity === 'positive').length; const negativeStrikes = total - positiveStrikes; + console.log('[Lightning] Stats panel updated:', { fresh, recent, total }); + div.innerHTML = `
diff --git a/src/plugins/layers/useWSPR.js b/src/plugins/layers/useWSPR.js index 3cea4a1..1f8b242 100644 --- a/src/plugins/layers/useWSPR.js +++ b/src/plugins/layers/useWSPR.js @@ -1034,7 +1034,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null }) { setHeatmapLayer(null); } - // Clear all paths and markers + // Clear all paths and markers - use refs to avoid infinite loop pathLayers.forEach(layer => { try { map.removeLayer(layer); } catch (e) {} }); @@ -1044,7 +1044,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null }) { setPathLayers([]); setMarkerLayers([]); } - }, [enabled, map, heatmapLayer, pathLayers, markerLayers]); + }, [enabled, map]); // REMOVED pathLayers, markerLayers from deps to prevent infinite loop return { paths: pathLayers, diff --git a/src/styles/main.css b/src/styles/main.css index 7848ec0..6a5c551 100644 --- a/src/styles/main.css +++ b/src/styles/main.css @@ -871,3 +871,31 @@ body::before { .lightning-stats:hover { border-color: rgba(255, 215, 0, 0.6); } + +/* Earthquake icon markers */ +.earthquake-icon { + z-index: 1000 !important; + pointer-events: auto; +} + +.earthquake-icon div { + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + user-select: none; +} + +/* Lightning icon markers */ +.lightning-icon { + z-index: 1000 !important; + pointer-events: auto; +} + +.lightning-icon div { + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + user-select: none; +}