topic Re: Arcgis-JS-API 4.10 - Basemapgallery Error in ArcGIS JavaScript Maps SDK Questions

Arcgis-JS-API 4.10 - Basemapgallery Error

SahanFaruk — Wed, 09 Jan 2019 12:45:06 GMT

Hi all

We have upgraded our JS-Api from 4.7 to 4.10 , everything works fine, only some issues need to be fixed. But then we realize when starting our app the BaseMap Gallery Widget is not working any more.

Error happens when doing following steps:

open widget
choose a basemap from the list

Result:

The basemap can not be loaded because of a classic null-pointer

Error from Browser log:

ERROR Error: Uncaught (in promise): TypeError: Cannot set property 'visible' of null
TypeError: Cannot set property 'visible' of null
at Object.<anonymous> (MapView.js:603)
at b.callback (dojo.js:365)
at b.notify (dojo.js:325)
at b.propertyInvalidated (dojo.js:326)
at b.propertyInvalidated (dojo.js:298)
at b.callback (dojo.js:330)
at b.notify (dojo.js:325)
at b.propertyCommitted (dojo.js:327)
at b.propertyCommitted (dojo.js:299)
at b.internalSet (dojo.js:297)
at resolvePromise (zone.js:795)
at zone.js:847
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:425)
at Object.onInvokeTask (core.es5.js:3881)
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:192)
at drainMicroTaskQueue (zone.js:602)
at ZoneTask.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:503)
at invokeTask (zone.js:1427)
at HTMLLIElement.globalZoneAwareCallback (zone.js:1445)

Does anybody has already met this problem or a similar problem?

regards,

Sahan

Re: Arcgis-JS-API 4.10 - Basemapgallery Error

BjornSvensson — Thu, 10 Jan 2019 19:04:15 GMT

Hi Sahan,
I can't repro this with the basic sample at https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=widgets-basemapgallery - even when changing to MapView as your error indicates.

Could you provide a simple sample that shows the problem?

Re: Arcgis-JS-API 4.10 - Basemapgallery Error

SahanFaruk — Sat, 11 Dec 2021 18:42:46 GMT

Hello Bjorn

Thanks for your answer.

Here is the sample code, which produces the error:

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>BasemapGallery widget - 4.10</title>
  <link rel="stylesheet" href="https://js.arcgis.com/4.10/esri/css/main.css">
  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>
  <script src="https://js.arcgis.com/4.10/"></script>
  <script>
    require([
      "esri/Map",
       "esri/Basemap",
      "esri/views/MapView",
      "esri/widgets/BasemapGallery",
       "esri/widgets/BasemapGallery/support/LocalBasemapsSource",
       "esri/layers/WMTSLayer"
    ], function(
      Map, Basemap, MapView, BasemapGallery, LocalBasemapsSource, WMTSLayer
    ) {
     
      var map = new Map();

      var view = new MapView({
        container: "viewDiv",
        map: map
      });

      
     var mapBaseLayer2 = new WMTSLayer({
       url: "https://gibs.earthdata.nasa.gov/wmts/epsg4326/best",
        copyright: "<a target='_top' href='https://earthdata.nasa.gov'>Earthdata</a> by <a target='_top' href='https://www.nasa.gov'>NASA</a>",
       activeLayer: {
           id: "SRTM_Color_Index"
         
        }
    });
     
     var mapBaseLayer1 = new WMTSLayer({
       url: "https://gibs.earthdata.nasa.gov/wmts/epsg4326/best",
        copyright: "<a target='_top' href='https://earthdata.nasa.gov'>Earthdata</a> by <a target='_top' href='https://www.nasa.gov'>NASA</a>",
       activeLayer: {
           id: "SRTM_Color_Index"
         
        }
    });
     // Create a Basemap with the WebTileLayer. The thumbnailUrl will be used for
     // the image in the BasemapToggle widget.
     var stamen = new Basemap({
       baseLayers: [ mapBaseLayer2 ],
       title: "test2",
       id: "test2",
       thumbnailUrl: "icon"
     });

     var stamen1 = new Basemap({
       baseLayers: [ mapBaseLayer1 ],
       title: "test",
       id: "test",
       thumbnailUrl: "icon"
     });
      var basemapGallery = new BasemapGallery({
        view: view,
          source: [stamen, stamen1],
          activeBasemap: stamen
      });

      // Add the widget to the top-right corner of the view
      view.ui.add(basemapGallery, {
        position: "top-right"
      });
    });
  </script>
</head>
<body>
  <div id="viewDiv"></div>
</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I hope this helps, for reproducing the error. The basemaps in the sample code come from an esri sample. (ArcGIS API for JavaScript Sandbox )

regards

Re: Arcgis-JS-API 4.10 - Basemapgallery Error

AndryJoos — Tue, 29 Jan 2019 12:31:54 GMT

This was filed as a bug:

BUG-000119655 - Basemap Gallery Widget errors switching between WMTS basemaps.

If anyone comes up with a workaround (other than using the JS API 4.9) that would be well appreciated 🙂