derive logic for "include roads without data" from selected attribute

This commit is contained in:
Paul Bienkowski 2022-07-25 22:24:31 +02:00
parent 1ad5fe562e
commit 76b1b41b4b
2 changed files with 19 additions and 10 deletions

View file

@ -44,12 +44,19 @@ export const reds = [
] ]
export function colorByCount(attribute = 'event_count', maxCount, colormap = viridis) { export function colorByCount(attribute = 'event_count', maxCount, colormap = viridis) {
return colormapToScale(colormap, ['case', ['to-boolean', ['get', attribute]], ['get', attribute], 0], 0, maxCount) return colormapToScale(colormap, ['case', isValidAttribute(attribute), ['get', attribute], 0], 0, maxCount)
} }
var steps = {'rural': [1.6,1.8,2.0,2.2], var steps = {'rural': [1.6,1.8,2.0,2.2],
'urban': [1.1,1.3,1.5,1.7]} 'urban': [1.1,1.3,1.5,1.7]}
export function isValidAttribute(attribute) {
if (attribute.endsWith('zone')) {
return ['in', ['get', attribute], ['literal', ['rural', 'urban']]]
}
return ['to-boolean', ['get', attribute]]
}
export function borderByZone() { export function borderByZone() {
return ["match", ['get', 'zone'], return ["match", ['get', 'zone'],
"rural", "cyan", "rural", "cyan",
@ -62,7 +69,7 @@ export function colorByDistance(attribute = 'distance_overtaker_mean', fallback
return [ return [
'case', 'case',
['!', ['to-boolean', ['get', attribute]]], ['!', isValidAttribute(attribute)],
fallback, fallback,
["match", ['get', 'zone'], "rural", ["match", ['get', 'zone'], "rural",
[ [

View file

@ -6,7 +6,7 @@ import produce from 'immer'
import {Page, Map} from 'components' import {Page, Map} from 'components'
import {useConfig} from 'config' import {useConfig} from 'config'
import {colorByDistance, colorByCount, borderByZone, reds} from 'mapstyles' import {colorByDistance, colorByCount, borderByZone, reds, isValidAttribute} from 'mapstyles'
import {useMapConfig} from 'reducers/mapConfig' import {useMapConfig} from 'reducers/mapConfig'
import RoadInfo from './RoadInfo' import RoadInfo from './RoadInfo'
@ -40,15 +40,16 @@ const untaggedRoadsLayer = {
minzoom: 12, minzoom: 12,
} }
const getUntaggedRoadsLayer = (colorAttribute, maxCount) =>
produce(untaggedRoadsLayer, (draft) => {
draft.filter = ['!', isValidAttribute(colorAttribute)]
})
const getRoadsLayer = (colorAttribute, maxCount) => const getRoadsLayer = (colorAttribute, maxCount) =>
produce(untaggedRoadsLayer, (draft) => { produce(untaggedRoadsLayer, (draft) => {
draft.id = 'obs_roads_normal' draft.id = 'obs_roads_normal'
if (colorAttribute.endsWith('_count')) { draft.filter = isValidAttribute(colorAttribute)
// delete draft.filter
draft.filter = ['to-boolean', ['get', colorAttribute]]
} else {
draft.filter = draft.filter[1] // remove '!'
}
draft.paint['line-width'][6] = 6 // scale bigger on zoom draft.paint['line-width'][6] = 6 // scale bigger on zoom
draft.paint['line-color'] = colorAttribute.startsWith('distance_') draft.paint['line-color'] = colorAttribute.startsWith('distance_')
? colorByDistance(colorAttribute) ? colorByDistance(colorAttribute)
@ -130,8 +131,9 @@ export default function MapPage() {
const layers = [] const layers = []
const untaggedRoadsLayerCustom = useMemo(() => getUntaggedRoadsLayer(attribute), [attribute])
if (mapConfig.obsRoads.show && mapConfig.obsRoads.showUntagged) { if (mapConfig.obsRoads.show && mapConfig.obsRoads.showUntagged) {
layers.push(untaggedRoadsLayer) layers.push(untaggedRoadsLayerCustom)
} }
const roadsLayer = useMemo(() => getRoadsLayer(attribute, maxCount), [attribute, maxCount]) const roadsLayer = useMemo(() => getRoadsLayer(attribute, maxCount), [attribute, maxCount])