Refactoring osm tags (wip)
This commit is contained in:
parent
29f92dca10
commit
c2705def86
|
@ -23,6 +23,7 @@ import { getZoomInteger } from '../map/Map';
|
||||||
import {
|
import {
|
||||||
getHighlightedTagValue,
|
getHighlightedTagValue,
|
||||||
getTagType,
|
getTagType,
|
||||||
|
isHighlightedTagType,
|
||||||
} 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';
|
||||||
|
@ -33,7 +34,6 @@ interface StyleParameters {
|
||||||
isSelected: boolean;
|
isSelected: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const icons = {
|
const icons = {
|
||||||
note: {
|
note: {
|
||||||
src: noteIcon,
|
src: noteIcon,
|
||||||
|
@ -567,8 +567,8 @@ const styles = {
|
||||||
if (getZoomInteger() < 16) {
|
if (getZoomInteger() < 16) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
const highlightedTagValue = getHighlightedTagValue(feature);
|
const tagType = getTagType(feature);
|
||||||
const isHighlightedFeature = !!highlightedTagValue;
|
const isHighlightedFeature = isHighlightedTagType(tagType);
|
||||||
if (
|
if (
|
||||||
(isHighlightedFeature && getZoomInteger() < 16) ||
|
(isHighlightedFeature && getZoomInteger() < 16) ||
|
||||||
(!isHighlightedFeature && getZoomInteger() < 18)
|
(!isHighlightedFeature && getZoomInteger() < 18)
|
||||||
|
@ -577,9 +577,7 @@ const styles = {
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
name: feature.get('name'),
|
name: feature.get('name'),
|
||||||
poiType: isHighlightedFeature
|
poiType: tagType,
|
||||||
? highlightedTagValue
|
|
||||||
: getTagType(feature),
|
|
||||||
isHighlighted: isHighlightedFeature,
|
isHighlighted: isHighlightedFeature,
|
||||||
isTextHidden: getZoomInteger() < 19,
|
isTextHidden: getZoomInteger() < 19,
|
||||||
};
|
};
|
||||||
|
|
|
@ -15,7 +15,7 @@ import { GpxViewer } from '../gpx';
|
||||||
import { Browser } from '@capacitor/browser';
|
import { Browser } from '@capacitor/browser';
|
||||||
import { isHighlighted } from '../map-tile-provider';
|
import { isHighlighted } from '../map-tile-provider';
|
||||||
import {
|
import {
|
||||||
getHighlightedTagValue,
|
isHighlightedTagType,
|
||||||
getTagType,
|
getTagType,
|
||||||
} from '../map-tile-provider/MapTileProvider';
|
} from '../map-tile-provider/MapTileProvider';
|
||||||
import style from '../gpx/styles';
|
import style from '../gpx/styles';
|
||||||
|
@ -216,9 +216,10 @@ const Infos: Component<{}> = (props) => {
|
||||||
<>
|
<>
|
||||||
{console.log({
|
{console.log({
|
||||||
caller: 'Infos / vector layer feature',
|
caller: 'Infos / vector layer feature',
|
||||||
highlightedTagValue:
|
|
||||||
getHighlightedTagValue(feature),
|
isHighlighted: isHighlightedTagType(
|
||||||
isHighlighted: isHighlighted(feature),
|
getTagType(feature)
|
||||||
|
),
|
||||||
tagValue: getTagType(feature),
|
tagValue: getTagType(feature),
|
||||||
properties: feature.getProperties(),
|
properties: feature.getProperties(),
|
||||||
style: style(feature),
|
style: style(feature),
|
||||||
|
|
|
@ -156,9 +156,6 @@ const currentOverlayHighlightedKey = () =>
|
||||||
? currentOverlay().highlighted
|
? currentOverlay().highlighted
|
||||||
: 'none';
|
: 'none';
|
||||||
|
|
||||||
export const currentOverlayHighlightedDefinition = () =>
|
|
||||||
currentCategory()[currentOverlayHighlightedKey()];
|
|
||||||
|
|
||||||
export const highlightedTags = () => {
|
export const highlightedTags = () => {
|
||||||
let result = {};
|
let result = {};
|
||||||
Object.keys(legacyOverlayDefinitions).forEach((tagName) => {
|
Object.keys(legacyOverlayDefinitions).forEach((tagName) => {
|
||||||
|
@ -218,42 +215,6 @@ export const highlightedTags = () => {
|
||||||
// });
|
// });
|
||||||
// });
|
// });
|
||||||
|
|
||||||
export const getHighlightedTagValue = (feature: Feature) => {
|
|
||||||
let result = false;
|
|
||||||
|
|
||||||
Object.keys(highlightedTags()).every((tagName) => {
|
|
||||||
const value = feature.get(tagName);
|
|
||||||
const highlightedValues = highlightedTags()[tagName];
|
|
||||||
// console.log({
|
|
||||||
// caller: 'MapTileProviders / highlightedTag / found',
|
|
||||||
// feature,
|
|
||||||
// feature_values: feature.values_,
|
|
||||||
// highlightedTags,
|
|
||||||
// tagName,
|
|
||||||
// tag_value: value,
|
|
||||||
// highlightedValues,
|
|
||||||
// });
|
|
||||||
|
|
||||||
if (value !== undefined && highlightedValues.includes(value)) {
|
|
||||||
result = value;
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
});
|
|
||||||
// console.log({
|
|
||||||
// caller: 'MapTileProviders / highlightedTag / result',
|
|
||||||
// feature,
|
|
||||||
// feature_values: feature.values_,
|
|
||||||
// highlightedTags,
|
|
||||||
// result,
|
|
||||||
// });
|
|
||||||
return result;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const isHighlighted = (feature: Feature) => {
|
|
||||||
return !!getHighlightedTagValue(feature);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const getTagType = (feature: Feature) => {
|
export const getTagType = (feature: Feature) => {
|
||||||
for (const tagType of Object.keys(osmTags)) {
|
for (const tagType of Object.keys(osmTags)) {
|
||||||
const tag: OsmTag = osmTags[tagType];
|
const tag: OsmTag = osmTags[tagType];
|
||||||
|
@ -265,6 +226,13 @@ export const getTagType = (feature: Feature) => {
|
||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const isHighlightedTagType = (tagType: string) => {
|
||||||
|
const currentOverlayHighlightedDefinition: string[] =
|
||||||
|
overlayDefinitions[currentOverlayKey()][currentOverlayHighlightedKey()];
|
||||||
|
return currentOverlayHighlightedDefinition.includes(tagType);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
const MapTilesProvider: Component<{}> = (props) => {
|
const MapTilesProvider: Component<{}> = (props) => {
|
||||||
const [open, setOpen] = createSignal(false);
|
const [open, setOpen] = createSignal(false);
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,5 @@ export {
|
||||||
default,
|
default,
|
||||||
mapTileProviders,
|
mapTileProviders,
|
||||||
currentCategory as currentOverlayDefinition,
|
currentCategory as currentOverlayDefinition,
|
||||||
currentOverlayHighlightedDefinition,
|
isHighlightedTagType,
|
||||||
isHighlighted,
|
|
||||||
} from './MapTileProvider';
|
} from './MapTileProvider';
|
||||||
|
|
|
@ -1,11 +1,7 @@
|
||||||
import { Component, createEffect, onMount } from 'solid-js';
|
import { Component, createEffect, onMount } from 'solid-js';
|
||||||
import OlMap from 'ol/Map';
|
import OlMap from 'ol/Map';
|
||||||
|
|
||||||
import {
|
import { currentOverlayDefinition, isHighlightedTagType } from '../map-tile-provider';
|
||||||
currentOverlayDefinition,
|
|
||||||
currentOverlayHighlightedDefinition,
|
|
||||||
isHighlighted,
|
|
||||||
} from '../map-tile-provider';
|
|
||||||
import { Feature } from 'ol';
|
import { Feature } from 'ol';
|
||||||
import MVT from 'ol/format/MVT';
|
import MVT from 'ol/format/MVT';
|
||||||
import { Point } from 'ol/geom';
|
import { Point } from 'ol/geom';
|
||||||
|
@ -174,7 +170,6 @@ export const Overlays: Component<Props> = ({ map }) => {
|
||||||
|
|
||||||
createEffect(() => {
|
createEffect(() => {
|
||||||
const overlayDefinition = currentOverlayDefinition();
|
const overlayDefinition = currentOverlayDefinition();
|
||||||
const overlayHighlightedDefinition = currentOverlayHighlightedDefinition();
|
|
||||||
const olMap = getMap();
|
const olMap = getMap();
|
||||||
if (olMap) {
|
if (olMap) {
|
||||||
olMap.removeLayer(clusterLayer);
|
olMap.removeLayer(clusterLayer);
|
||||||
|
|
Loading…
Reference in New Issue