Dyomedea
/
dyomedea
1
1
Fork 0
Code Issues 4 Pull Requests Projects 3 Releases 1 Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/gpx/styles.ts
View File

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