Make the scale match the map

This commit is contained in:
gluap 2021-12-19 12:56:52 +01:00 committed by Paul Bienkowski
parent f1f7ff1976
commit a5f5acd6d5
2 changed files with 13 additions and 10 deletions

View file

@ -33,8 +33,9 @@ export function colormapToScale(colormap, value, min, max) {
export const viridis = simplifyColormap(viridisBase.map(rgbArrayToColor), 20)
export const grayscale = ['#FFFFFF', '#000000']
export const reds = [
['rgba', 255, 0, 0, 0],
['rgba', 255, 0, 0, 1],
'rgba( 255, 0, 0, 0)',
'rgba( 255, 0, 0, 255)',
]
]
export function colorByCount(attribute = 'event_count', maxCount, colormap = viridis) {

View file

@ -81,6 +81,7 @@ function LayerSidebar({
/>
</List.Item>
{attribute.endsWith('_count') ? (
<>
<List.Item>
<List.Header>Maximum value</List.Header>
<Input
@ -90,14 +91,15 @@ function LayerSidebar({
onChange={(_e, {value}) => setMapConfigFlag('obsRoads.maxCount', value)}
/>
</List.Item>
) : null}
</>
)}
{showRoads && (
<>
<List.Item>
<ColorMapLegend map={_.chunk(colorByCount('obsRoads.maxCount',mapConfig.obsRoads.maxCount, reds).slice(3), 2)} />
</List.Item></>
) :
(
<List.Item>
<ColorMapLegend map={_.chunk(colorByDistance('distance_overtaker')[3].slice(3), 2)} />
</List.Item>
)}
</>
)}
<Divider />