BasemapGallery widget setting basemap invisible when zoom in

300
8
Jump to solution
06-06-2018 08:04 AM
HelenZhou
Occasional Contributor

Hello,

In a Web Appbuilder application (developer edition), I would like the basemap added through BasemapGallery widget be set as invisible when zoom in to certain scale, how do I achieve this?

Thanks

Helen

0 Kudos
1 Solution

Accepted Solutions
HelenZhou
Occasional Contributor

Thanks Robert for quick reply. Code doesn't work because the layer is of type basemaplayer which doesn't have the setMinScale methods. So I have tried to add a few line of code to the initBasemaps function before the line "this.basemapGallery.startup();"

and it works.

Thanks so much Robert. You are always so helpful. I am so glad that we have you to help us in this forum.

I am working on a WAB project for City of Arlington Texas. I may have some more questions to ask the forum.

Helen

//==================================================================

          this.basemapGallery = new BasemapGallery(config, this.basemapGalleryDiv);
          var items = array.map(this.basemapGallery.basemaps, function (basemap) {
              var layers = basemap.getLayers();
              array.map(layers, function (layer) {
                  layer.displayLevels = [10, 11, 12, 13, 14, 15];
              });
          });

View solution in original post

8 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Helen,

   The best way I can think of is to add a min scale to the basemap layers inside the BasemapGallery widget. You can see in the widgets code that the updateExtent method is called when a basemap is selected and in that function you will see code for getting the selected basemap and its layers in the loop of the layer you would call setMinScale method on the layer. I don't have an exact code sample for this, just this advice.

0 Kudos
HelenZhou
Occasional Contributor

Thanks Robert, I have checked the code, the UpdateExtent method is called when a a basemap is selected in basemapGallery widget. Changing code may not fit my purpose. My purpose is , base map is loaded to the map when a basemap is selected. But it is invisible when the map is zoomed in to certain level. I can set up the initial basemap to be visible at certain scale range when I create the map in Portal for GIS. But for any basemap selected from the basemap gallery, I can't set up the visible scale range.

I have tried to change the configuration jason file to set up the minScale and MaxScale from there, that still not works.

Also, I have checked the basemap, basemapgallery and basemaplayer from the ESRI javascript API document (version 3.24) and can't find a method or property to set the basemap invisible.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Helen,

   So I don't understand how using the basemap gallery selected basemap to get the basemap layers and then set the layer minscale using the layers setMinScale method would not work for you then?

0 Kudos
HelenZhou
Occasional Contributor

Robert, I mean, I have tried to set the minScale and maxScale in the basemapGallry's configure json file, it doesn't work.

0 Kudos
HelenZhou
Occasional Contributor

I also looked at the basemap Gallery's widget.js file for the updateExtent method. It looks like it is for use of update map's extent to find best matched map scales for basemap to be loaded in the map. My purpose is to load basemap after the base map is selected from the basemap gallery widget. But the basemap will not display when my map is zoomed in to certain scale. Thanks.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Helen,

   I understand your purpose and have suggested using a code update to the Basemap gallery widget in the selectionChange function you can add code that you borrow from the updateExtent method to get the layers of the selected base map and then set the layers minscale using the JS APIs Layer.setMinScale function.

Something like:

      selectionChange: function() {
        var basemap = this.basemapGallery.getSelected();
        var layers = basemap.getLayers();
        array.map(layers, function(layer) {
          layer.setMinScale(50000);
        });
        this.updateExtent();

        if (this.gid === 'widgetOnScreen') {
          PanelManager.getInstance().closePanel(this.id + '_panel');
        }
      },
HelenZhou
Occasional Contributor

Thanks Robert for quick reply. Code doesn't work because the layer is of type basemaplayer which doesn't have the setMinScale methods. So I have tried to add a few line of code to the initBasemaps function before the line "this.basemapGallery.startup();"

and it works.

Thanks so much Robert. You are always so helpful. I am so glad that we have you to help us in this forum.

I am working on a WAB project for City of Arlington Texas. I may have some more questions to ask the forum.

Helen

//==================================================================

          this.basemapGallery = new BasemapGallery(config, this.basemapGalleryDiv);
          var items = array.map(this.basemapGallery.basemaps, function (basemap) {
              var layers = basemap.getLayers();
              array.map(layers, function (layer) {
                  layer.displayLevels = [10, 11, 12, 13, 14, 15];
              });
          });

View solution in original post

RobertScheitlin__GISP
MVP Esteemed Contributor

Helen,

   Don't forget to mark this question as answered.

0 Kudos