Latest Contributions by JaredPilbeam2

This question is a continuation of my last post. I'm attempting to combine Swipe and Map. In my sample, my goal is to initialize on the 1862 webmap with the basemap and vector tile layer as the leading swipe layer. The webmaps should be the trailing swipe layers. Then, I want the ability to click back and forth between the other webmap(s) while also being able to swipe. Right now, the swipe doesn't mesh with the webmaps. When I click one of the buttons I get: Uncaught (in promise) "No layerview has been found for the layer" What's confusing me is that components do not use views as far as I understand. Here's how I did it with the current JS SDK: <script> require(["esri/Map", "esri/views/MapView", "esri/layers/ImageryLayer", "esri/widgets/Swipe", "esri/WebMap", ], (Map, MapView, ImageryLayer, Swipe, WebMap) => { //webmap IDs /************************************************************ * Create multiple WebMap instances ************************************************************/ const webmapids = [ "e67a8eb6768641c19d4a7c5df394dbf4", //DTM "bfc5b0242adb42bfb0fc41e54497dfc8", //DSM "6ed3d2e495db4e859a73d2a32ce3d576", //HEDEM "d653b18bc941458491e06e657e10f393", //Intensity "a9ab25b1c7204764b2fabad6fc7a4635", //IR "e6bab92ebc524072a3305ec8f128e8f8", //Soil "2f9acebfb8db4e10bb6dddab8d3239c7", //ClosedDepressions ]; const webmaps = webmapids.map((webmapid) => { return new WebMap({ portalItem: { // autocasts as new PortalItem() id: webmapid, } }); }); // add image services used in the swipe map const imagery2024 = new ImageryLayer({ url: "https://gis.willcountyillinois.com/portal/sharing/servers/871887c09c234de98109ed4033f842ad/rest/services/Orthoimagery/Orthos_2024_3IN/ImageServer", }); webmaps[0].add(imagery2024); /************************************************************ * Initialize the View with the first WebMap ************************************************************/ const view = new MapView({ map: webmaps[0], container: "viewDiv", constraints: { maxScale: 500, minScale: 300000, } }); console.log('construct the view') //use promise function.when to add the imagery layer after the webmap group layer, hence, rendering it over the group layers view.when(function () { console.log('show the view') webmaps[0].add(imagery2024); }); // create a new Swipe widget let swipe = new Swipe({ leadingLayers: [imagery2024], // trailingLayers: [imagery2024], position: 45, // set position of widget to 35% dragLabel: "drag left or right", view: view, }); // add the widget to the view view.ui.add(swipe); /************************************************************ * On a button click, change the map of the View ************************************************************/ document.querySelector(".btns").addEventListener("click", (event) => { const id = event.target.getAttribute("data-id"); if (id) { const webmap = webmaps[id]; view.map = webmap; webmap.add(imagery2024); // promise webmap.when(function () { webmap.add(imagery2024); console.log("View loaded"); }, function (error) { }); const nodes = document.querySelectorAll(".btn-switch"); for (let idx = 0; idx < nodes.length; idx++) { const node = nodes[idx]; const mapIndex = node.getAttribute("data-id"); if (mapIndex === id) { node.classList.add("active-map"); } else { node.classList.remove("active-map"); } } } }); }); </script> ... View more

How would I convert this sample to map components? I have an existing app that combines that sample with a swipe widget. And I'm attempting to update it. I've gotten as far as utilizing the arcgis-swipe component, but I'm stuck on how to implement more than one webmap. ... View more

After finding out about the transition to components, I'm wondering how I should proceed with the search widget? I'm about to build an app template (that will be followed by many) that includes searching a feature layer. As of now that's only possible with the widget as far as I can tell? ... View more

I don't see a way to control the zoom? I don't see a property to do so. This has no effect: <arcgis-search position="top-left" zoom="10"></arcgis-search>     ... View more

<arcgis-map zoom="13" center="-88.1, 41.5"> <arcgis-zoom position="top-left"></arcgis-zoom> <arcgis-swipe swipe-position="32"></arcgis-swipe> <arcgis-expand position="top-right"> <arcgis-layer-list label="1862 Imagery" visibility="checkbox" ></arcgis-layer-list> </arcgis-expand> </arcgis-map>   I thought I would be able to change the layer name from AerialBW1862 by using a label property in the Layer List component, but it has no effect. I've tried most other relevant-sounding properties, but still no effect. Here is a sample.  ... View more