diff --git a/src/components/gpx/styles.ts b/src/components/gpx/styles.ts
index 087fac3..3311134 100644
--- a/src/components/gpx/styles.ts
+++ b/src/components/gpx/styles.ts
@@ -1,7 +1,8 @@
import { Fill, Text, Icon, Stroke, Style } from 'ol/style';
import startIcon from '../../icons/flag-start-b-svgrepo-com-green.svg';
import finishIcon from '../../icons/flag-finish-b-o-svgrepo-com-red.svg';
-import wptIcon from '../../icons/location-pin-svgrepo-com-red.svg';
+import wptIcon from '../../icons/location-pin-svgrepo-com-green.svg';
+import wptIconSel from '../../icons/location-pin-svgrepo-com-red.svg';
import { Feature } from 'ol';
import memoize from 'memoizee';
@@ -17,6 +18,9 @@ const textStroke = new Stroke({
const textFill = new Fill({
color: '#000',
});
+const textFillSel = new Fill({
+ color: 'red',
+});
const styles = {
default: {
@@ -66,6 +70,22 @@ const styles = {
width: 3,
}),
},
+ wpt: {
+ image: new Icon({
+ src: wptIconSel,
+ scale: 0.1,
+ opacity: 0.9,
+ anchor: [0.5, 1],
+ }),
+ text: (feature: Feature) =>
+ new Text({
+ font: '16px Calibri,sans-serif',
+ text: feature.get('name'),
+ fill: textFillSel,
+ stroke: textStroke,
+ offsetY: -40,
+ }),
+ },
},
};
@@ -90,15 +110,15 @@ const getStyle = memoize(
const defaults = styles.default[type];
const selected = styles.selected[type];
const all = isSelected ? { ...defaults, ...selected } : { ...defaults };
- console.log({
- caller: 'style / getStyle',
- type,
- isSelected,
- params,
- defaults,
- selected,
- all,
- });
+ // console.log({
+ // caller: 'style / getStyle',
+ // type,
+ // isSelected,
+ // params,
+ // defaults,
+ // selected,
+ // all,
+ // });
for (const key of Object.keys(all)) {
if (all[key] instanceof Function) {
all[key] = all[key](params);
@@ -112,7 +132,7 @@ const getStyle = memoize(
export const style = (feature: Feature, resolution: number) => {
const type = feature.get('type');
const isSelected = feature.get('isSelected') === true;
- console.log({ caller: 'style', type, isSelected });
+ // console.log({ caller: 'style', type, isSelected });
if (styleRequiresFeature(type)) {
return getStyle(type, isSelected, feature);
}
diff --git a/src/icons/location-pin-svgrepo-com-blue.svg b/src/icons/location-pin-svgrepo-com-blue.svg
new file mode 100644
index 0000000..2851e02
--- /dev/null
+++ b/src/icons/location-pin-svgrepo-com-blue.svg
@@ -0,0 +1,14 @@
+
+
diff --git a/src/icons/location-pin-svgrepo-com-green.svg b/src/icons/location-pin-svgrepo-com-green.svg
index ecd50ea..ede772d 100644
--- a/src/icons/location-pin-svgrepo-com-green.svg
+++ b/src/icons/location-pin-svgrepo-com-green.svg
@@ -1,14 +1,23 @@
-
-