Hi Brandon,
The BasemapToggle seems to be simpler than the BasemapGallery widget. It may not support your basemap. I think that is why I ended up using the BasemapGallery widget and tried to make it behave like a BasemapToggle. I only have one basemap in the gallery and I use the selection-change event to toggle the basemaps. One of my basemaps includes the World Imagery service and an Esri vector tile reference service. Here is a portion of the JavaScript I used. This doesn't include loading the modules, the HTML, or the CSS. However, you can see that I created BasemapLayers to make Basemaps, then used the Basemaps in the BasemapGallery widget. This would probably work for you and is highly flexible about the source services you use. I don't have any experience with your story map type, so I don't want to make any recommendations about how to handle each map. I can imagine that each Map object needs this process repeated so that it has its own set of objects.
var topoLayer = new BasemapLayer({
url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
});
var topoBasemap = new Basemap({
layers: [topoLayer],
title: "Topo",
thumbnailUrl: "http://www.arcgis.com/sharing/rest/content/items/6e03e8c26aad4b9c92a87c1063ddb0e3/info/thumbnail/top..."
});
var imageryLayer = new BasemapLayer({
url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
});
var hybridReferenceLayer = new BasemapLayer({
styleUrl: "http://lacsdgis.maps.arcgis.com/sharing/rest/content/items/af6063d6906c4eb589dfe03819610660/resource...",
type: "VectorTileLayer"
});
var imageryBasemap = new Basemap({
layers: [imageryLayer, hybridReferenceLayer],
title: "Satellite",
thumbnailUrl: "http://www.arcgis.com/sharing/rest/content/items/413fd05bbd7342f5991d5ec96f4f8b18/info/thumbnail/ima..."
});
var basemapGallery = new BasemapGallery({
map: app.map,
basemaps: [imageryBasemap],
showArcGISBasemaps: false
}, "basemapGallery");
basemapGallery.on("selection-change", function () {
if (basemapGallery.basemaps[0] === topoBasemap) {
basemapGallery.remove(topoBasemap.id);
basemapGallery.add(imageryBasemap);
} else if (basemapGallery.basemaps[0] === imageryBasemap) {
basemapGallery.remove(imageryBasemap.id);
basemapGallery.add(topoBasemap);
};
});
basemapGallery.startup();
Sorry for the code formatting, but I can't find the tools for formatting it properly. I just see really basic tools.
Nathan