Displaying thumbnails on the map

This commit is contained in:
Eric van der Vlist 2023-04-24 15:26:03 +02:00
parent e08d6993c1
commit 9beb1eb1a3
1 changed files with 13 additions and 5 deletions

View File

@ -33,6 +33,7 @@ import {
} from '../map-tile-provider/MapTileProvider';
import { getCenter } from 'ol/extent';
import { getVectorTileFeatureType } from '../overlays/overlay-definitions';
import { Category } from '../wpt/WptEditDialog';
interface StyleParameters {
type: string;
@ -175,23 +176,30 @@ const memoizeOptions = {
const styles = {
wpt: {
getParameters: (feature: Feature) => {
const minZoom = feature.get('extensions')?.['dyo:minZoom'];
const extensions = feature.get('extensions');
const minZoom = extensions?.['dyo:minZoom'];
const category = extensions?.category;
return {
isSelected: feature.get('isSelected') ?? false,
text: feature.get('name'),
customIcon:
icons[feature.get('sym') as keyof typeof icons] ||
icons[feature.get('extensions')?.category as keyof typeof icons],
icons[category as keyof typeof icons],
thumbnailUrl:
category === Category.PICTURE ? extensions?.thumbnailUrl : undefined,
hidden: minZoom && getZoominteger() < minZoom,
};
},
getStyle: memoize((params: any) => {
// console.log({ caller: 'getStyle', params });
const { isSelected, text, customIcon, hidden } = params;
const { isSelected, text, customIcon, hidden, thumbnailUrl } = params;
if (hidden) {
return null;
}
const icon = customIcon ?? wptIconObj;
const thumbnailIcon = !!thumbnailUrl
? { src: thumbnailUrl, scale: 1 / 2, anchor: [0.5, 0.5] }
: undefined;
const icon = customIcon ?? thumbnailIcon ?? wptIconObj;
return new Style({
image: new Icon(icon),
text: new Text({