Hello,
I try to reproduce a tabbed application but with the possibility to have widgets in the map. (The Story Map Mapseries is too limited).
This example is almost perfect for me: https://developers.arcgis.com/javascript/latest/sample-code/webmap-swap/index.html
But when I add widgets (Home Button for example), they only load after clicking a tab.
Someone can help me ?
Here my code
/************************************************************
* Create multiple WebMap instances
************************************************************/
var webmaps = webmapids.map(function(webmapid) {
return new WebMap({
portalItem: {
// autocasts as new PortalItem()
id: webmapid
}
});
});
/************************************************************
* Initialize the View with the first WebMap
************************************************************/
var view = new MapView({
map: webmaps[0],
container: "viewDiv"
});
var homeBtn = new Home({
view: view
});
var layerList = new LayerList({
view: view
});
document
.querySelector(".btns")
.addEventListener("click", function(event) {
/************************************************************
* On a button click, change the map of the View
************************************************************/
var id = event.target.getAttribute("data-id");
if (id) {
var webmap = webmaps[id];
view.map = webmap;
var nodes = document.querySelectorAll(".btn-switch");
for (var idx = 0; idx < nodes.length; idx++) {
var node = nodes[idx];
var mapIndex = node.getAttribute("data-id");
if (mapIndex === id) {
node.classList.add("active-map");
} else {
node.classList.remove("active-map");
}
}
}
view.ui.add(homeBtn, "top-left");
view.ui.add(layerList, "bottom-left");
});
Btw if we could switch between layers and not webmaps it would be even better!
thank you in advance
