QWC2: Basemap Switcher

To use the Basemap switcher and select Basemap, follow below.

In our demonstration, we’ll be using OpenStreetMap, Carto Light, and ESRI Satellite.

Open themesConfig.json for the Tenant using vi or WinSCP or text editor

/var/www/qwc2/config-in/TENANT_NAME/themesConfig.json

Update defaultBackgroundLayers section:

"defaultBackgroundLayers": [
    {
      "name": "mapnik",
      "visibility": true
    },
    {
      "name": "carto"
    },
    {
      "name": "esri"
    }
  ],

Add/Update backgroundLayers section:

"backgroundLayers": [
            {
                "name": "mapnik",
                "title": "Open Street Map",
                "type": "osm",
                "source": "osm",
                "thumbnail": "mapnik.jpg",
                "attribution": "OpenStreetMap contributors",
                "attributionUrl": "https://www.openstreetmap.org/copyright"
            },
            {
                "name": "carto",
                "title": "Carto Light",
                "type": "xyz",
                "url": "https://{1-4}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png",
                "thumbnail": "carto.jpg",
                "attribution": "CartoDB with OpenStreetMap contributors",
                "attributionUrl": "https://www.openstreetmap.org/copyright"
            },
            {
                "name": "esri",
                "title": "ESRI Satellite",
                "type": "xyz",
                "url": "https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}.png",
                "thumbnail": "esri.jpg",
                "attribution": "ESRI with OpenStreetMap contributors",
                "attributionUrl": "https://www.openstreetmap.org/copyright"
            }
        ],

Place the thumbnail image for your basemaps in:

/var/www/qwc2/html/assets/img/mapthumbs

Run the QWC2 Configuration utility.

Your Basemap switcher should now appear as below: