Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Cancel
- Home
- :
- All Communities
- :
- Developers
- :
- JavaScript Maps SDK
- :
- JavaScript Maps SDK Questions
- :
- 4.26 to 4.28 upgrade of Expand widget containing a...
Options
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Mute
- Printer Friendly Page
4.26 to 4.28 upgrade of Expand widget containing a BasemapGallery widget not rendering upon expand
Subscribe
10-27-2023
07:39 AM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I am having trouble transitioning from v4.26 of the sdk to v4.28. My basemap gallery used to function properly, but now after upgrading it is not rendering within the expand content div. The following is a config file I use (Imported to javascript as an object: _config), and the code follows. Any help would be appreciated.
{
"id": "basemapgallery",
"version": 4.20,
"expanded": false,
"visible": true,
"defaultThumbnail": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/default.jpg",
"basemaps": {
"en": [
{
"id": "BASE_NSTDB_10k_Colour_WM84",
"title": "Nova Scotia Colour Topographic",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSColour.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Colour",
"title": "1:10 000 Colour Topographic Map",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Colour_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Grey_WithGeoNameLabels_WM84",
"title": "Nova Scotia Grey Canvas",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSGrey.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Grey_WithGeoNameLabels",
"title": "1:10 000 Grey Base Map",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Grey_WithGeoNameLabels_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Grey_WM84",
"title": "Nova Scotia Grey Canvas with Roads",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSTopo.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Grey",
"title": "1:10 000 Grey Base Map",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Grey_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Roads_WM84",
"title": "Nova Scotia Roads",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSRoads.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Roads",
"title": "1:10 000 Base Roads",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Roads_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSODB_10k_WM84",
"title": "Nova Scotia Imagery",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSImagery.png",
"layers": [
{
"id": "BASE_NSODB_10k",
"title": "1:10 000 Base Imagery",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSODB_10k_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Light_Gray",
"title": "Light Gray Canvas",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/LightGreyCanvas.jpg",
"layers": [
{
"id": "World_Light_Gray_Base",
"title": "Light Grey Base",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer"
},
{
"id": "World_Light_Gray_Reference",
"title": "Light Grey Reference",
"isReference": true,
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Reference/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Dark_Gray",
"title": "Dark Grey Canvas",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/DarkGreyCanvas.png",
"layers": [
{
"id": "World_Dark_Gray_Base",
"title": "Dark Grey Base",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Dark_Gray_Base/MapServer"
},
{
"id": "World_Dark_Gray_Reference",
"title": "Dark Grey Reference",
"isReference": true,
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Dark_Gray_Reference/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Imagery",
"title": "World Imagery",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldImagery.jpg",
"layers": [
{
"id": "World_Imagery_2017",
"title": "World Imagery 2017",
"visibility": true,
"opacity": 1,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Street_Map",
"title": "World Roads",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldStreets.jpg",
"layers": [
{
"id": "World_Street_Map_8421",
"title": "World Street Map",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Topo_Map",
"title": "World Topographic",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldTopo.jpg",
"layers": [
{
"id": "defaultBasemap",
"title": "World Topology Basemap",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
}
],
"fr": [
{
"id": "BASE_NSTDB_10k_Colour_WM84",
"title": "Carte Topographique Couleur de la Nouvelle-Écosse",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSColour.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Colour",
"title": "Carte Topographique en Couleur 1:10 000",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Colour_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Grey_WithGeoNameLabels_WM84",
"title": "Toile Grise de la Nouvelle-Écosse",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSGrey.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Grey_WithGeoNameLabels",
"title": "Carte de Base Grise 1:10 000",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Grey_WithGeoNameLabels_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Grey_WM84",
"title": "Toile Grise de la Nouvelle-Écosse avec Routes",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSTopo.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Grey",
"title": "Carte de Base Grise 1:10 000",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Grey_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSTDB_10k_Roads_WM84",
"title": "Routes de la Nouvelle-Écosse",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSRoads.png",
"layers": [
{
"id": "BASE_NSTDB_10k_Roads",
"title": "Routes de Base 1:10 000",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSTDB_10k_Roads_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "BASE_NSODB_10k_WM84",
"title": "Images de la Nouvelle-Écosse",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/NSImagery.png",
"layers": [
{
"id": "BASE_NSODB_10k",
"title": "Imagerie de Base 1:10 000",
"url": "https://nsgiwa.novascotia.ca/arcgis/rest/services/BASE/BASE_NSODB_10k_WM84/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Light_Gray",
"title": "Toile Gris Clair",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/LightGreyCanvas.jpg",
"layers": [
{
"id": "World_Light_Gray_Base",
"title": "Base Gris Clair",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer"
},
{
"id": "World_Light_Gray_Reference",
"title": "Référence Gris Clair",
"isReference": true,
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Reference/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Dark_Gray",
"title": "Toile Gris Foncé",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/DarkGreyCanvas.png",
"layers": [
{
"id": "World_Dark_Gray_Base",
"title": "Base Gris Foncé",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Dark_Gray_Base/MapServer"
},
{
"id": "World_Dark_Gray_Reference",
"title": "Référence Gris Foncé",
"isReference": true,
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Dark_Gray_Reference/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Imagery",
"title": "Imagerie Mondiale",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldImagery.jpg",
"layers": [
{
"id": "World_Imagery_2017",
"title": "Imagerie Mondiale 2017",
"visibility": true,
"opacity": 1,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Street_Map",
"title": "Routes Mondiale",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldStreets.jpg",
"layers": [
{
"id": "World_Street_Map_8421",
"title": "Carte des Rues du Monde",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
},
{
"id": "World_Topo_Map",
"title": "Topographie Mondiale",
"thumbnailURL": "src/widgets/widgetbar/assets/widgets/basemapgallery/img/WorldTopo.jpg",
"layers": [
{
"id": "defaultBasemap",
"title": "Carte de Base de la Topologie Mondiale",
"opacity": 1,
"visibility": true,
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
}
],
"spatialReference": {
"wkid": 102100
}
}
]
}
}
let basemaps = _config.basemaps as _Basemaps;
let basemapArray = basemaps[_lang] as Array<_Basemap>;
var _basemaps = new Collection<Basemap>();
basemapArray.map (baseMap => {
var _basemap: Basemap;
var _title = baseMap.title? baseMap.title: baseMap.id? baseMap.id: "";
var _spatialReference = new SpatialReference();
if (baseMap.spatialReference) {
_spatialReference = baseMap.spatialReference;
}
_basemap = new Basemap({
id: baseMap.id,
title: _title,
thumbnailUrl: baseMap.thumbnailURL? baseMap.thumbnailURL : _default_thumbnail? _default_thumbnail: undefined,
spatialReference: _spatialReference? _spatialReference: undefined
});
if (baseMap.layers && baseMap.layers.length > 0) {
var _layers = new Collection<MapImageLayer>();
var _refLayers = new Collection<MapImageLayer>();
baseMap.layers.map(layer => {
if (layer.url && typeof layer.url === "string") {
var lyr = getLayer(layer)
if (lyr) {
if (layer.isReference && layer.isReference === true) {
_refLayers.add(lyr);
} else {
_layers.add(lyr);
}
}
}
});
_basemap.baseLayers = _layers;
_basemap.referenceLayers = _refLayers;
};
_basemaps.push(_basemap);
});
let _basemapGallery = new BasemapGallery({
view: _mapView,
label: _label,
source: new LocalBasemapsSource({
basemaps: _basemaps
})
});
_basemapGallery_expand.id = widget.id;
_basemapGallery_expand.view = _mapView;
_basemapGallery_expand.visible = _visible;
_basemapGallery_expand.content = _basemapGallery;
_basemapGallery_expand.expanded = _expanded;
_basemapGallery_expand.group = _group;
_basemapGallery_expand.container = widget.id;
_basemapGallery_expand.collapseIcon = "chevron-up";
_mapView.when(() => {
_basemapGallery_expand.expandTooltip = `${_basemapGallery.label}`;
});
_basemapGallery_expand.when(() => {
_basemapGallery.source.basemaps.forEach(basemap => {
basemap.baseLayers.forEach(layer => {
var lyr = layer as MapImageLayer;
console.log(`Layer URL (${lyr.id}): ${lyr.url}`);
});
});
console.log("BasemapGallery widget rendered.");
resolve(_basemapGallery_expand);
});
Solved! Go to Solution.
1 Solution
Accepted Solutions
10-30-2023
04:40 AM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi @AnneFitz, I have created a basic widget and it does seem to work. Looks like it is something else that has changed to make it behave differently than in 4.26. I will have to investigate further on my end.
3 Replies
10-27-2023
01:50 PM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi, I'm having trouble reproducing the issue with your code above, and everything seems to be fine with our samples that use the Expand widget and BasemapGallery: https://developers.arcgis.com/javascript/latest/sample-code/basemaps-portal/
Have you tried removing the Expand widget and just rendering the BasemapGallery on it's own? Let me know if that works for you or if you get similar errors. Also, if you could provide a simpler repro case in a codepen or codesandbox, that would help us get to the bottom of this much faster. Thank you!
10-30-2023
04:40 AM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi @AnneFitz, I have created a basic widget and it does seem to work. Looks like it is something else that has changed to make it behave differently than in 4.26. I will have to investigate further on my end.
2 weeks ago
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I have the same problem. Did you solve it?
