gwadaking/radarsargasses
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: couleur forecasts → même orange sargasses que observations

Browse Source 
Les prévisions utilisent la même couleur (#f4a020/#c47a10) que les
observations confirmées, avec fill à 20% (vs 50%) et contour tirets.
Lecture immédiate : "sargasses futures" sans rupture visuelle arbitraire.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Gwadaking
2026-04-03 21:01:46 -04:00
parent cdc8fe90ac
commit 3136b5e7fc
1 changed files with 6 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/components/Map/SargassesMap.jsx
View File

@@ -77,10 +77,9 @@ const makeLayerStyles = (isPrediction, opacity) => ({
type: 'fill', type: 'fill',
source: isPrediction ? 'forecasts' : 'observations', source: isPrediction ? 'forecasts' : 'observations',
paint: { paint: {
'fill-color': isPrediction ? '#818cf8' : '#f4a020', // Prévisions : même couleur sargasses que l'observation, juste atténuée
// Prévisions : fill très transparent — le contour tiré porte l'info, 'fill-color': '#f4a020',
// le fill laisse voir la carte (y compris la terre) en dessous 'fill-opacity': (isPrediction ? 0.20 : 0.50) * opacity,
'fill-opacity': (isPrediction ? 0.12 : 0.50) * opacity,
'fill-opacity-transition': { duration: 350 }, 'fill-opacity-transition': { duration: 350 },
}, },
}, },
@@ -89,10 +88,9 @@ const makeLayerStyles = (isPrediction, opacity) => ({
type: 'line', type: 'line',
source: isPrediction ? 'forecasts' : 'observations', source: isPrediction ? 'forecasts' : 'observations',
paint: { paint: {
'line-color': isPrediction ? '#6366f1' : '#c47a10', 'line-color': '#c47a10',
// Prévisions : contour plus épais et tirets plus marqués 'line-width': 2.5,
'line-width': isPrediction ? 2.5 : 2.5, 'line-opacity': opacity * (isPrediction ? 0.65 : 0.85),
'line-opacity': opacity * (isPrediction ? 0.75 : 0.85),
'line-opacity-transition': { duration: 350 }, 'line-opacity-transition': { duration: 350 },
...(isPrediction ? { 'line-dasharray': [6, 4] } : {}), ...(isPrediction ? { 'line-dasharray': [6, 4] } : {}),
}, },