Change Basemap at set scales

5081
5
Jump to solution
06-18-2015 11:50 AM
MelanieHammond1
New Contributor III

Does anyone know if there is a way to have the basemap change when it gets to a certain scale? In other words have the app open with one basemap such as terrain but have it switch to streets when zoomed in beyond a certain scale. I wasn't able to find a post on this and wasn't sure where that would be set in Web AppBuilder. My only concern with actually doing this is still letting the user change the basemap whenever they like. Seems like a tall order but thought I would pose the question.

Thanks

0 Kudos
1 Solution

Accepted Solutions
StanMcShinsky
Occasional Contributor III

Melanie Hammond,

Here is an easy way to do this. In Web app builder under the basemap widget add a second basemap to one already in your basemap gallery like so.

Here I added the topo basemap to the streets one.

Now in the config_Basemap Gallery.json file find the location where both maps are added.

Add in the two line for "displayLevels": [], (in this example it is on lines 8 and 15). Now you can specify what levels you want the basemap to display and I will change automatically.

 {
        "title": "Streets",
        "thumbnailUrl": "//provo.maps.arcgis.com/sharing/rest/content/items/d8855ee4d3d74413babfb0f41203b168/info/thumbnail/world_street_map.jpg",
        "layers": [
          {
            "id": "World_Street_Map_8421",
            "opacity": 1,
            "displayLevels": [11,12,13,14,15,16,17,18],
            "visibility": true,
            "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"
          },
    {
            "id": "topo",
            "opacity": 1,
            "displayLevels": [1,2,3,4,5,6,7,8,9,10],
            "visibility": true,
            "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
          }
        ],
        "spatialReference": {
          "wkid": "102100"
        }
      },

Hope this helps.

-Stan

View solution in original post

5 Replies
TimWitt2
MVP Alum

Melanie,

that should be doable. Work with extent-change event Map | API Reference | ArcGIS API for JavaScript

Within that functions have an if statement that says if extent > some value change the basemap Map | API Reference | ArcGIS API for JavaScript .

Just some food for thought.

Tim

0 Kudos
StanMcShinsky
Occasional Contributor III

Melanie Hammond,

Here is an easy way to do this. In Web app builder under the basemap widget add a second basemap to one already in your basemap gallery like so.

Here I added the topo basemap to the streets one.

Now in the config_Basemap Gallery.json file find the location where both maps are added.

Add in the two line for "displayLevels": [], (in this example it is on lines 8 and 15). Now you can specify what levels you want the basemap to display and I will change automatically.

 {
        "title": "Streets",
        "thumbnailUrl": "//provo.maps.arcgis.com/sharing/rest/content/items/d8855ee4d3d74413babfb0f41203b168/info/thumbnail/world_street_map.jpg",
        "layers": [
          {
            "id": "World_Street_Map_8421",
            "opacity": 1,
            "displayLevels": [11,12,13,14,15,16,17,18],
            "visibility": true,
            "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"
          },
    {
            "id": "topo",
            "opacity": 1,
            "displayLevels": [1,2,3,4,5,6,7,8,9,10],
            "visibility": true,
            "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
          }
        ],
        "spatialReference": {
          "wkid": "102100"
        }
      },

Hope this helps.

-Stan

MelanieHammond1
New Contributor III

Thanks Stan! That is fantastic. Works great. Do you know though if there is a place to change the basemap that is in use with the current map in the app? I did what you mentioned and when I choose that basemap in the basemap gallery it does exactly as expected. But what I really want is to only change the basemap in my current map to do that and not the default basemap. Looks like that basemap is set based on the map you utilize in the actual AGOL map though. Maybe no way to change the behavior of that?

0 Kudos
MelanieHammond1
New Contributor III

I did somewhat solve by adding the basemap that I want to turn off at a certain scale as a layer to my map in AGOL and setting the scale there. Works like a charm and turns off when it should leaving the basemap showing. Just FYI in case anyone else is trying to do the same.

0 Kudos
BraulioCordova
New Contributor III

Thank you very much,

0 Kudos