add hover

zbycz · Aug 7, 2024 · 3669a8b · 3669a8b
1 parent ed9b2a3
commit 3669a8b
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 28 deletions.
diff --git a/src/components/Map/behaviour/featureHover.ts b/src/components/Map/behaviour/featureHover.ts
@@ -3,10 +3,16 @@ export const addHoverPaint = (origStyle) => {
   const iconOpacity = ['case', ['boolean', ['feature-state', 'hideIcon'], false], 0, hoverExpr]; // prettier-ignore
 
   origStyle.layers
-    .filter((layer) => layer.id.match(/^poi-/))
+    .filter(
+      (layer) =>
+        layer['source-layer'] === 'poi' ||
+        layer['source-layer'] === 'outdoor_poi',
+    )
     .forEach((layer) => {
       if (layer.paint) {
+        // TODO for outdoor style they use it for hiding icons by zoom layer id:'Outdoor'
         layer.paint['icon-opacity'] = iconOpacity; // eslint-disable-line no-param-reassign
+        layer.paint['text-opacity'] = iconOpacity; // eslint-disable-line no-param-reassign
       }
     });
 

diff --git a/src/components/Map/behaviour/useToggleTerrainControl.tsx b/src/components/Map/behaviour/useToggleTerrainControl.tsx
@@ -3,7 +3,7 @@ import maplibregl from 'maplibre-gl';
 import { createMapEventHook } from '../../helpers';
 
 const TERRAIN = {
-  source: 'terrain',
+  source: 'terrain-rgb',
   exaggeration: 1,
 };
 

diff --git a/src/components/Map/helpers.ts b/src/components/Map/helpers.ts
@@ -12,8 +12,13 @@ const isOsmLayer = (id) => {
 
 export const layersWithOsmId = (style) =>
   style.layers // TODO make it custom for basic/outdoor + revert place_
-    .map((x) => x.id)
-    .filter((id) => isOsmLayer(id));
+    .filter(
+      (layer) =>
+        layer['source-layer'] === 'poi' ||
+        layer['source-layer'] === 'outdoor_poi',
+    )
+    .map((x) => x.id);
+// .filter((id) => isOsmLayer(id));
 
 export const getIsOsmObject = ({ id, layer }) => {
   // these layers with id <= ~10000 are broken

diff --git a/src/components/Map/styles/outdoorStyle.ts b/src/components/Map/styles/outdoorStyle.ts
@@ -4,7 +4,7 @@ import {
 } from './layers/buildings3dLayers';
 import { poiLayers } from './layers/poiLayers';
 import { addHoverPaint } from '../behaviour/featureHover';
-import { BACKGROUND, GLYPHS, OSMAPP_SOURCES, OSMAPP_SPRITE } from '../consts';
+import { GLYPHS, OSMAPP_SOURCES, OSMAPP_SPRITE } from '../consts';
 import { motorwayConstruction } from './layers/contruction';
 import { overpassLayers } from './layers/overpassLayers';
 import { cliffsLayers } from './layers/cliffsLayers';
@@ -1437,29 +1437,30 @@ export const outdoorStyle = addHoverPaint({
       },
       filter: ['==', 'class', 'military'],
     },
-    {
-      id: 'Building',
-      type: 'fill',
-      source: 'maptiler_planet',
-      'source-layer': 'building',
-      minzoom: 13,
-      layout: {
-        visibility: 'visible',
-      },
-      paint: {
-        'fill-antialias': true,
-        'fill-color': [
-          'interpolate',
-          ['exponential', 1],
-          ['zoom'],
-          13,
-          'hsl(0, 0%, 82%)',
-          18,
-          'hsl(0, 0%, 72%)',
-        ],
-        'fill-outline-color': 'hsl(0, 0%, 77%)',
-      },
-    },
+    // {
+    //   id: 'Building',
+    //   type: 'fill',
+    //   source: 'maptiler_planet',
+    //   'source-layer': 'building',
+    //   minzoom: 13,
+    //   layout: {
+    //     visibility: 'visible',
+    //   },
+    //   paint: {
+    //     'fill-antialias': true,
+    //     'fill-color': [
+    //       'interpolate',
+    //       ['exponential', 1],
+    //       ['zoom'],
+    //       13,
+    //       'hsl(0, 0%, 82%)',
+    //       18,
+    //       'hsl(0, 0%, 72%)',
+    //     ],
+    //     'fill-outline-color': 'hsl(0, 0%, 77%)',
+    //   },
+    // },
+    ...buildings3dExtrusion,
     {
       id: 'Trails outline',
       type: 'line',