Moving vector tile layer's MVT to Feature (instead of RenederdFeature) to prepare for clustering.

src/components/gpx/styles.ts

@@ -280,7 +280,7 @@ const styles = {
       });
     }, memoizeOptions),
   },
-  LineString: {
+  way: {
     strokes: {
       iwn: new Stroke({
         color: [174, 33, 219, 0.8],
@@ -312,7 +312,7 @@ const styles = {
       console.log({ caller: 'getStyle', params });
       const { isSelected, name, network } = params;
       return new Style({
-        stroke: styles.LineString.strokes[network],
+        stroke: styles.way.strokes[network],
         text: new Text({
           text: name,
           font: 'bold 14px "Open Sans", "Arial Unicode MS", "sans-serif"',
@@ -325,8 +325,7 @@ const styles = {
       });
     }, memoizeOptions),
   },
-  MultiLineString: {},
-  Point: {
+  poi: {
     getParameters: (feature: Feature) => {
       const klass: string = feature.get('class');
       const isHighlighted = highlight.hasOwnProperty(klass);
@@ -375,8 +374,6 @@ const styles = {
   },
 };
 
-styles.MultiLineString = styles.LineString;
-
 export const style = (feature: Feature, resolution: number) => {
   const type = (
     feature.get('type') !== undefined ? feature.get('type') : feature.type_

src/components/map/Map.tsx

@@ -236,7 +236,7 @@ const Map: Component = () => {
     });
 
     const vectorTileSource1 = new VectorTileSource({
-      format: new MVT(),
+      format: new MVT({ featureClass: Feature }),
       url: 'https://geo.dyomedea.com/services/spain/tiles/{z}/{x}/{y}.pbf',
       maxZoom: 14,
     });