Highlighting housing

This commit is contained in:
Eric van der Vlist 2023-01-16 16:28:34 +01:00
parent cb8e564270
commit 356c4b0eba
2 changed files with 21 additions and 5 deletions

View File

@ -98,4 +98,16 @@ export const osmIcons = {
wilderness_hut, wilderness_hut,
}; };
export const highlight = {
hotel,
alpine_hut,
apartment,
camp_site,
chalet,
guest_house,
hostel,
motel,
wilderness_hut,
};
export default osmIcons; export default osmIcons;

View File

@ -20,7 +20,7 @@ import { Point } from 'ol/geom';
import { Coordinate } from 'ol/coordinate'; import { Coordinate } from 'ol/coordinate';
import { createDefaultStyle } from 'ol/style/Style'; import { createDefaultStyle } from 'ol/style/Style';
import osmIcons from './osm-icons'; import osmIcons, { highlight } from './osm-icons';
import { indexOf } from 'lodash'; import { indexOf } from 'lodash';
interface StyleParameters { interface StyleParameters {
@ -328,17 +328,21 @@ const styles = {
MultiLineString: {}, MultiLineString: {},
Point: { Point: {
getParameters: (feature: Feature) => { getParameters: (feature: Feature) => {
const klass: string = feature.get('class');
const isHighlighted = highlight.hasOwnProperty(klass);
return { return {
isSelected: feature.get('isSelected') ?? false, isSelected: feature.get('isSelected') ?? false,
name: feature.get('name'), name: feature.get('name'),
klass: feature.get('class'), klass,
isHighlighted,
isTextHidden: zoom() < 19, isTextHidden: zoom() < 19,
isHidden: zoom() < 16, isHidden: !isHighlighted && zoom() < 16,
}; };
}, },
getStyle: memoize((params: any) => { getStyle: memoize((params: any) => {
console.log({ caller: 'getStyle', params }); console.log({ caller: 'getStyle', params });
const { isSelected, name, klass, isHidden, isTextHidden } = params; const { isSelected, name, klass, isHidden, isTextHidden, isHighlighted } =
params;
if (isHidden) { if (isHidden) {
return null; return null;
} }
@ -349,7 +353,7 @@ const styles = {
return new Style({ return new Style({
image: new Icon({ image: new Icon({
src: icon, src: icon,
scale: 1.5, scale: isHighlighted ? 3 : 1.5,
opacity: 1, opacity: 1,
// anchor: [0, 0], // anchor: [0, 0],
}), }),