Hiding layers in the GeoMap plugin

Grafana Geomap Panel
1

Hello everyone!

I have configured a panel using the GeoMap plugin. Everything looks fine but would be nice to have one feature - a check button that enables or disables layers (example in the fig below).
layers
Maybe there is already a feature like that or similar, but I have not found anything in the documentation. I consider that feature very useful since sometimes panels may be overwhelmed with markers and a UI, that hides some layers, helps a lot.

I am using Grafana OSS version 9.3.6.

Would be thankful for any ideas on how to reach that.

3 Likes
2

Same question here!

3

On the top right corner of geomap there is a filtering capability but not very intuitively designed

Screenshot_20240325-072611_Chrome
Screenshot_20240325-072611_Chrome720×1480 128 KB

4

I dont seem to have this option. I have multiple route layers to show different track colors based on different values. But there seems to be no option to hide / show the different layers for routes?
Screenshot 2024-04-22 114114

Grafana v10.4.2

5

My geo map doesnot have this icon on right top corner.
Should I enable some config?

6

what version of grafana are you on?

7

10.4.1
and Grafana Cloud

8

what datasource is being fed to your geomap?

9

I can use TestData data source or postgres to reproduce it.
the following json is a sample:

{
  "annotations": {
    "list": [
      {
        "builtIn": 1,
        "datasource": {
          "type": "grafana",
          "uid": "-- Grafana --"
        },
        "enable": true,
        "hide": true,
        "iconColor": "rgba(0, 211, 255, 1)",
        "name": "Annotations & Alerts",
        "type": "dashboard"
      }
    ]
  },
  "editable": true,
  "fiscalYearStartMonth": 0,
  "graphTooltip": 0,
  "id": 24,
  "links": [],
  "panels": [
    {
      "datasource": {
        "type": "grafana-testdata-datasource",
        "uid": "f35c59ee-500f-4372-84d0-e750b0c50fab"
      },
      "fieldConfig": {
        "defaults": {
          "color": {
            "mode": "thresholds"
          },
          "custom": {
            "hideFrom": {
              "legend": false,
              "tooltip": false,
              "viz": false
            }
          },
          "mappings": [],
          "thresholds": {
            "mode": "absolute",
            "steps": [
              {
                "color": "green",
                "value": null
              },
              {
                "color": "red",
                "value": 80
              }
            ]
          }
        },
        "overrides": []
      },
      "gridPos": {
        "h": 18,
        "w": 18,
        "x": 5,
        "y": 0
      },
      "id": 1,
      "options": {
        "basemap": {
          "config": {},
          "name": "Layer 0",
          "type": "default"
        },
        "controls": {
          "mouseWheelZoom": true,
          "showAttribution": true,
          "showDebug": false,
          "showMeasure": false,
          "showScale": false,
          "showZoom": true
        },
        "layers": [
          {
            "config": {
              "showLegend": true,
              "style": {
                "color": {
                  "fixed": "dark-green"
                },
                "opacity": 0.4,
                "rotation": {
                  "fixed": 0,
                  "max": 360,
                  "min": -360,
                  "mode": "mod"
                },
                "size": {
                  "fixed": 5,
                  "max": 15,
                  "min": 2
                },
                "symbol": {
                  "fixed": "img/icons/marker/circle.svg",
                  "mode": "fixed"
                },
                "symbolAlign": {
                  "horizontal": "center",
                  "vertical": "center"
                },
                "textConfig": {
                  "fontSize": 12,
                  "offsetX": 0,
                  "offsetY": 0,
                  "textAlign": "center",
                  "textBaseline": "middle"
                }
              }
            },
            "filterData": {
              "id": "byRefId",
              "options": "txg"
            },
            "location": {
              "mode": "auto"
            },
            "name": "txg",
            "tooltip": true,
            "type": "markers"
          },
          {
            "config": {
              "showLegend": true,
              "style": {
                "color": {
                  "fixed": "red"
                },
                "opacity": 0.4,
                "rotation": {
                  "fixed": 0,
                  "max": 360,
                  "min": -360,
                  "mode": "mod"
                },
                "size": {
                  "fixed": 5,
                  "max": 15,
                  "min": 2
                },
                "symbol": {
                  "fixed": "img/icons/marker/circle.svg",
                  "mode": "fixed"
                },
                "symbolAlign": {
                  "horizontal": "center",
                  "vertical": "center"
                },
                "textConfig": {
                  "fontSize": 12,
                  "offsetX": 0,
                  "offsetY": 0,
                  "textAlign": "center",
                  "textBaseline": "middle"
                }
              }
            },
            "filterData": {
              "id": "byRefId",
              "options": "b"
            },
            "location": {
              "mode": "auto"
            },
            "name": "B",
            "tooltip": true,
            "type": "markers"
          }
        ],
        "tooltip": {
          "mode": "details"
        },
        "view": {
          "allLayers": true,
          "id": "fit",
          "lat": 0,
          "lon": 0,
          "zoom": 15
        }
      },
      "pluginVersion": "11.1.0-70958",
      "targets": [
        {
          "csvContent": "lon,lat,spot\r\n120.609832,24.133681,彩虹眷村\r\n120.696155,24.084631,Dali Art藝術廣場\r\n120.619676,24.130485,TAICHUNG新地標（筏子溪迎賓廊道）\r\n120.646461,24.178824,逢甲夜市\r\n120.683548,24.137815,宮原眼科",
          "datasource": {
            "type": "grafana-testdata-datasource",
            "uid": "f35c59ee-500f-4372-84d0-e750b0c50fab"
          },
          "refId": "txg",
          "scenarioId": "csv_content"
        },
        {
          "csvContent": "景點名稱,lat,lon\r\n鹿港老街,24.0833,120.5333\r\n成美文化園,24.0667,120.5333\r\n百果山探索樂園,24.0667,120.5167\r\n南天宮十八層地獄,24.0833,120.5833\r\n扇形車庫,24.0833,120.5667",
          "datasource": {
            "type": "grafana-testdata-datasource",
            "uid": "f35c59ee-500f-4372-84d0-e750b0c50fab"
          },
          "refId": "b",
          "scenarioId": "csv_content"
        }
      ],
      "title": "Panel Title",
      "type": "geomap"
    }
  ],
  "schemaVersion": 39,
  "tags": [],
  "templating": {
    "list": []
  },
  "time": {
    "from": "now-6h",
    "to": "now"
  },
  "timeRangeUpdatedDuringEditOrView": false,
  "timepicker": {},
  "timezone": "browser",
  "title": "2 layers test",
  "uid": "bdndcoley8glcf",
  "version": 1,
  "weekStart": ""
}
1 Like
10

Apologies this feature is not in geomap but in orchestra cities plugin

image