Streets Basemap Initial View after changing mapStartBasemap

[RiverGlen]

Hello, thank you for the open-source CMV-App 1.3.4.

Here's the issue I am having:
Using CMV-app, I have made changes to viewer.js and basemap.js to switch the initial Basemap from a custom "Streets" to a custom "Shaded Relief". It makes the change but in the initial launch of the app, it still shows the Streets basemap before quickly switching to Shaded Relief. Am I missing a customized change that is not in the viewer.js or basemap.js? Thanks for all replies.

[tmcgee]

@RiverGlen It sounds like the basemap in the mapOptions section of your viewer.js is is set to streets or something other than the custom basemap you want. The documentation has an example of using a custom basemap in mapOptions: http://docs.cmv.io/en/1.3.4/configure/mapOptions/

[RiverGlen]

Tim Thanks, I followed those instructions for MapOptions in viewer.js and I switched the mapStartBasemap to 'shadedrelief'. However, if I change basemap: to shadedrelief, it wont load the application. Thus, I get a blank grid with the "PoweredbyEsri logo in the map window and no tools open in the left pane.

In basemap.js I have configure 'Shaded Relief' basemap to use as:

shadedrelief: {
title: 'Shaded Relief',
basemap: new Basemap({
id: 'shadedrelief',
layers: [new BasemapLayer({
url: 'http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer'
//url: 'http://basemap.nationalmap.gov/arcgis/rest/services/USGSShadedReliefOnly/MapServer'
})]
})
},

Is there a limitation to using a custom basemap as your basemap option in the MapOptions?

[tmcgee]

As you describe it, I believe the problem is in viewer.js. You need to have the custom basemap in that file. It should be something like this:

mapOptions: {
   basemap: new Basemap({
        id: 'shadedrelief',
        layers: [new BasemapLayer({
            url: 'http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer'
        })]
    }),
    center: [0,0],
    zoom: 5,
    sliderStyle: 'small',
    showAttribution: true
}

Also, as it is noted in the docs you must add references to esri/dijit/Basemap, esri/dijit/BasemapLayer" to the define section at the top of viewer.js

[RiverGlen]

Cheers Tim, that makes the difference! I had tried that code but did not have it loaded under MapOptions. For those novice types like me one more note, is that not only adding the esri/dijit references Tim suggested above but make sure to add the function objects too:

function (units, Extent, esriConfig, GeometryService, ImageParameters, Basemap, BasemapLayer) {

[ERS-Long]

Hi, Tim:

Seems that works for all other basemap type, but not for the google basemap family.

if tried to add the following basemap as default

        basemap: new Basemap({
            id: 'googleStreets',
            layers: [new BasemapLayer({
                url: "https://mt${subDomain}.google.com/vt/lyrs=m&hl=en&gl=en&x=${col}&y=${row}&z=${level}&s=png",
                copyright: "Google, 2015",
                id: "googleStreets",
                subDomains: ["0", "1", "2", "3"],
                type:"WebTiledLayer"
                })
            ]
        }),

then I see the following error in the debug console

Map.setBasemap: Unknown basemap layer type: "WebTiledLayer" found in basemap definition for: "".
init.js:315 Map.setBasemap: Unable to add basemap: "".

Please let me know if you know the fix for this or not.

Thanks

[tmcgee]

@ERS-Long correct. Esri JavaScript API does not support WebTiledLayer layer type for the initial basemap in mapOptions. See PR #522 I had some additional comments about the layer types that Esri supports for the initial basemap.

[ERS-Long]

@tmcgee Thanks for the info.