BasemapToggle icon for webmap basemap (4x)

1318
6
Jump to solution
03-11-2017 09:03 AM
DirkVandervoort
Occasional Contributor II

My map app loads a webmap hosted on our Portal. The webmap has the national-geographic as its basemap. I've added a BasemapToggle to the map app - it uses hybrid. When the map loads the BasemapToggle icon displays with a generic appearance - and not as icon representing the national-geographic basemap. Then the basemap gets toggled, the generic icon gets put under the hybrid icon.

  

My question is:

When the map loads in I add the BasemapToggle to the scene, can I interrogate the webmap to get the correct icon for the basemap?

TIA

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Dirk,

   By observing the network requests when using a web map that has NG as its basemap,  I can see there is no request for the NG basemap thumbnail so this seems to be a bug that needs to be reported to esri tech support.

View solution in original post

0 Kudos
6 Replies
RobertScheitlin__GISP
MVP Emeritus

Dirk,

  Strange I don't have that problem with this code:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Get started with widgets using BasemapToggle - 4.3</title>

  <link rel="stylesheet" href="https://js.arcgis.com/4.3/esri/css/main.css">
  <script src="https://js.arcgis.com/4.3/"></script>

  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <script>
    require([
        "esri/Map",
        "esri/views/MapView",
        "esri/widgets/BasemapToggle",
        "dojo/domReady!"
      ],
      function(Map, MapView, BasemapToggle) {

        // Create the Map with an initial basemap
        var map = new Map({
          basemap: "national-geographic"
        });

        // Create the MapView and reference the Map in the instance
        var view = new MapView({
          container: "viewDiv",
          map: map,
          center: [-86.049, 38.485],
          zoom: 3
        });

        // 1 - Create the widget
        var toggle = new BasemapToggle({
          // 2 - Set properties
          view: view, // view that provides access to the map's 'topo' basemap
          nextBasemap: "hybrid" // allows for toggling to the 'hybrid' basemap
        });

        // Add widget to the top right corner of the view
        view.ui.add(toggle, "top-right");
      });
  </script>
</head>
<body>
  <div id="viewDiv"></div>
</body>
</html>
0 Kudos
DirkVandervoort
Occasional Contributor II

Let me clarify with code - am referring to webmap hosted on AGOL/Portal that have a basemap. The code below is linear. This also occurs when the mapView is returned in a promise:

            var webMap = new WebMap({ // has "national-geographic" basemap
              portalItem: {
                id: <CRYPTIC_WEBMAP_ID_IN_AGOL_OR_PORTAL>
              }
            });

            var mapView = new MapView({
              map: webMap,
              container: "mapDiv"
            })

            var basemapToggle = new BasemapToggle({
                view: mapView,
                nextBasemap: "hybrid"  // Allows for toggling to the "hybrid" basemap
            });
            mapView.ui.add(basemapToggle, "top-right");

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Dirk,

   By observing the network requests when using a web map that has NG as its basemap,  I can see there is no request for the NG basemap thumbnail so this seems to be a bug that needs to be reported to esri tech support.

0 Kudos
StefanUseldinger
Occasional Contributor II

I am also using a Portal webmap and two Portal basemaps. You have to call load() on your Portal nextbasemap to make the thumbnail appear.

0 Kudos
StefanUseldinger
Occasional Contributor II

Have You found a solution? I am also having this issue (as well as others)

0 Kudos
ReaganSenoron
New Contributor II

Hi, any solution to this? The thumbnail of the default basemap(webmap) is still using the default thumbnail. We already generated a thumbnail in the portal. Thanks

0 Kudos