[Fix] hide pinned selection outline when layer is hidden (#2181)

Signed-off-by: Ihor Dykhta <dikhta.igor@gmail.com> Co-authored-by: Jacob Wasilkowski <4933392+jwasilgeo@users.noreply.github.com>
keplergl · Apr 4, 2023 · 8589730 · 8589730
1 parent d441d5f
commit 8589730
Show file tree

Hide file tree

Showing 8 changed files with 20 additions and 3 deletions.
diff --git a/src/layers/src/arc-layer/arc-layer.ts b/src/layers/src/arc-layer/arc-layer.ts
@@ -285,6 +285,7 @@ export default class ArcLayer extends Layer {
         ? [
             new DeckArcLayer({
               ...this.getDefaultHoverLayerProps(),
+              visible: defaultLayerProps.visible,
               data: [hoveredObject],
               widthScale,
               getSourceColor: this.config.highlightColor,

diff --git a/src/layers/src/cluster-layer/cluster-layer.ts b/src/layers/src/cluster-layer/cluster-layer.ts
@@ -115,12 +115,15 @@ export default class ClusterLayer extends AggregationLayer {
         ...gpuFilter.filterValueUpdateTriggers
       }
     };
+
+    const defaultLayerProps = this.getDefaultDeckLayerProps(opts);
+
     const {_filterData: filterData, ...clusterData} = data;
     const hoveredObject = this.hasHoveredObject(objectHovered);
 
     return [
       new DeckGLClusterLayer({
-        ...this.getDefaultDeckLayerProps(opts),
+        ...defaultLayerProps,
         ...clusterData,
         filterData,
 
@@ -149,6 +152,7 @@ export default class ClusterLayer extends AggregationLayer {
         ? [
             new ScatterplotLayer<{radius: number}>({
               id: `${this.id}-hovered`,
+              visible: defaultLayerProps.visible,
               data: [hoveredObject],
               getFillColor: this.config.highlightColor,
               getRadius: d => d.radius,

diff --git a/src/layers/src/geojson-layer/geojson-layer.ts b/src/layers/src/geojson-layer/geojson-layer.ts
@@ -457,11 +457,13 @@ export default class GeoJsonLayer extends Layer {
             : {})
         }
       }),
+      // hover layer
       ...(hoveredObject && !visConfig.enable3d
         ? [
             new DeckGLGeoJsonLayer({
               ...this.getDefaultHoverLayerProps(),
               ...layerProps,
+              visible: defaultLayerProps.visible,
               wrapLongitude: false,
               data: [hoveredObject],
               getLineWidth: data.getLineWidth,

diff --git a/src/layers/src/grid-layer/grid-layer.ts b/src/layers/src/grid-layer/grid-layer.ts
@@ -115,14 +115,15 @@ export default class GridLayer extends AggregationLayer {
   renderLayer(opts) {
     const {data, objectHovered, mapState} = opts;
 
+    const defaultAggregationLayerProps = this.getDefaultAggregationLayerProp(opts);
     const zoomFactor = this.getZoomFactor(mapState);
     const {visConfig} = this.config;
     const cellSize = visConfig.worldUnitSize * 1000;
     const hoveredObject = this.hasHoveredObject(objectHovered);
 
     return [
       new EnhancedGridLayer({
-        ...this.getDefaultAggregationLayerProp(opts),
+        ...defaultAggregationLayerProps,
         ...data,
         wrapLongitude: false,
         cellSize
@@ -133,6 +134,7 @@ export default class GridLayer extends AggregationLayer {
         ? [
             new GeoJsonLayer({
               ...this.getDefaultHoverLayerProps(),
+              visible: defaultAggregationLayerProps.visible,
               wrapLongitude: false,
               data: [
                 pointToPolygonGeo({

diff --git a/src/layers/src/h3-hexagon-layer/h3-hexagon-layer.ts b/src/layers/src/h3-hexagon-layer/h3-hexagon-layer.ts
@@ -339,10 +339,12 @@ export default class HexagonIdLayer extends Layer {
           }
         }
       }),
+      // hover layer
       ...(hoveredObject && !config.sizeField
         ? [
             new GeoJsonLayer({
               ...this.getDefaultHoverLayerProps(),
+              visible: defaultLayerProps.visible,
               data: [idToPolygonGeo(hoveredObject)],
               getLineColor: config.highlightColor,
               lineWidthScale: DEFAULT_LINE_SCALE_VALUE * zoomFactor,

diff --git a/src/layers/src/hexagon-layer/hexagon-layer.ts b/src/layers/src/hexagon-layer/hexagon-layer.ts
@@ -123,14 +123,16 @@ export default class HexagonLayer extends AggregationLayer {
 
   renderLayer(opts) {
     const {data, objectHovered, mapState} = opts;
+
+    const defaultAggregationLayerProps = this.getDefaultAggregationLayerProp(opts);
     const zoomFactor = this.getZoomFactor(mapState);
     const {visConfig} = this.config;
     const radius = visConfig.worldUnitSize * 1000;
     const hoveredObject = this.hasHoveredObject(objectHovered);
 
     return [
       new EnhancedHexagonLayer({
-        ...this.getDefaultAggregationLayerProp(opts),
+        ...defaultAggregationLayerProps,
         ...data,
         wrapLongitude: false,
         radius
@@ -141,6 +143,7 @@ export default class HexagonLayer extends AggregationLayer {
         ? [
             new GeoJsonLayer({
               ...this.getDefaultHoverLayerProps(),
+              visible: defaultAggregationLayerProps.visible,
               wrapLongitude: false,
               data: [
                 hexagonToPolygonGeo(hoveredObject, {}, radius * visConfig.coverage, mapState)

diff --git a/src/layers/src/icon-layer/icon-layer.ts b/src/layers/src/icon-layer/icon-layer.ts
@@ -376,12 +376,14 @@ export default class IconLayer extends Layer {
             extensions
           }),
 
+          // hover layer
           ...(hoveredObject
             ? [
                 // @ts-expect-error SvgIconLayerProps needs getIcon Field
                 new SvgIconLayer({
                   ...this.getDefaultHoverLayerProps(),
                   ...layerProps,
+                  visible: defaultLayerProps.visible,
                   data: [hoveredObject],
                   parameters,
                   getPosition: data.getPosition,

diff --git a/src/layers/src/point-layer/point-layer.ts b/src/layers/src/point-layer/point-layer.ts
@@ -382,6 +382,7 @@ export default class PointLayer extends Layer {
             new ScatterplotLayer({
               ...this.getDefaultHoverLayerProps(),
               ...layerProps,
+              visible: defaultLayerProps.visible,
               data: [hoveredObject],
               getLineColor: this.config.highlightColor,
               getFillColor: this.config.highlightColor,