Latest Contributions by René_Ténière

After some trial and error I came up with the following. It is not perfect as some of the labels in the widget may not be calcite elements, however, this in combination with some CSS tricks will work. The following is a basic example for the measurement widget. For the layerlist I used the VM and constructed it using Calcite components. I needed to manipulate it more than the widget could offer. import type MeasurementWidget from "@arcgis/core/widgets/Measurement"; const measurement = useRef<MeasurementWidget>(); useEffect(() => { if (mapView) { Promise.all([ import('@arcgis/core/widgets/Measurement') ]).then(result => { const MeasurementWidget = result[0].default; measurement.current = new MeasurementWidget({ view: mapView, container: elementIDs.measurement_widgetDivID }); measurement.current.when().then((_measurement: MeasurementWidget) => { // The Measurement Widget mutates after state change, therefore we cannot use reactiveUtils. const widgetDiv = document.getElementById(elementIDs.measurement_widgetDivID); if (widgetDiv) { const observer = new MutationObserver((mutationList, observer) => { const _calciteElements = widgetDiv.querySelectorAll("[scale]"); _calciteElements.forEach((element: any) => { if (element.scale !== measurementScale) { element.scale = measurementScale; } }); }); observer.observe(widgetDiv, {childList: true, subtree: true}); } }); }); } },[mapView]) useEffect(() => { // Perform final tasks after the t9n and config loads. if (measurementLocalesT9n && measurementConfig && measurementScale && measurementLocale) { // Set the component title const t9n = measurementLocalesT9n && measurementLocalesT9n[measurementLocale as keyof typeof measurementLocalesT9n]? measurementLocalesT9n[measurementLocale as keyof typeof measurementLocalesT9n] as any: null; measurementActionTitle = t9n? t9n?.title: ""; // Find all calcite elements and change their scale const widgetDiv = document.getElementById(elementIDs.measurement_widgetDivID); if (widgetDiv) { const _calciteElements = widgetDiv.querySelectorAll("[scale]"); _calciteElements.forEach((element: any) => { element.scale = measurementScale; }); } } }, [measurementLocalesT9n, measurementConfig, measurementScale, measurementLocale]); <CalcitePopover component-id={measurementConfig? measurementConfig.id: ""} id={elementIDs.measurement_popoverID} closable scale={measurementScale} label={measurementLocalesT9n? measurementLocalesT9n[measurementLocale as keyof typeof measurementLocalesT9n]?.title as string: ""} referenceElement={elementIDs.measurement_actionButtonID} placement="bottom-end" className={`measurement_popover__calcitepopover measurement_popover__calcitepopover--${measurementScale}`} heading={measurementLocalesT9n? measurementLocalesT9n[measurementLocale as keyof typeof measurementLocalesT9n]?.title: ""} onCalcitePopoverBeforeOpen={measurementPopover_onopen} onCalcitePopoverBeforeClose={measurementPopover_onclose}> <div id={elementIDs.measurement_popoverDivID} className="measurement_popover__div"> <CalciteAction text="" icon="measure" scale={measurementScale} onClick={() => {measurement.current? measurement.current.activeTool = "distance": null}}></CalciteAction> <CalciteAction text="" icon="measure-area" scale={measurementScale} onClick={() => {measurement.current? measurement.current.activeTool = "area": null}}></CalciteAction> <CalciteAction text="" icon="measure-line" scale={measurementScale} onClick={() => {measurement.current? measurement.current.activeTool = "direct-line": null}}></CalciteAction> <div id={elementIDs.measurement_widgetDivID}></div> </div> </CalcitePopover> .measurement_popover__calcitepopover { max-width: 600px; } .measurement_popover__calcitepopover--s .esri-widget, .measurement_popover__calcitepopover--s h3.esri-widget__heading { font-size: 0.9em; } .measurement_popover__calcitepopover--m .esri-widget, .measurement_popover__calcitepopover--m h3.esri-widget__heading { font-size: 1.1em; } .measurement_popover__calcitepopover--l .esri-widget, .measurement_popover__calcitepopover--l h3.esri-widget__heading { font-size: 1.3em; }

Could you add a header slot to the popover and other calcite components that are similar? Currently I use a calcite label with dynamic scale using the header slot so that the header changes size with the rest of the components. This is a very convenient way to perform this task using React. I realize there is a heading level, however, when most other calcite components use a scale system ('s'|'m'|'l'), it is better for me to stick to that standard.

‎03-05-2024

I have just upgraded to v4.29 and am trying to incorporate the LayerList widget to the rest of my site. All my calcite 2.6.x components are reactive to scale, i.e. I can set the scale in the menu and all components will change. I would like to do the same with the LayerList widget, however, I do not see a way to control the scale attribute. Am I missing something? Should I use the VM instead? Any ideas or suggestions? Thanks, René

‎01-11-2024

Hi @GeoJosh , Yes, that does help. Thanks. René

‎12-05-2023

The url parameter is decoded properly within code (decodeURI() will properly return the escaped parameter). The issue is that you cannot rely on user validation. Upon further digging I have found that the applicationUrl is not uri encoded when added to the esriConfig: JSON.parse('{"esriConfig":{"applicationName":"","applicationUrl":"http://localhost:5173/?locale=fr&config=assets\\config\\config.json", JSON.parse() does not seem to accept an escaped \ (\\). If the input URL is: http://localhost:5173/?locale=fr&config=assets%5cconfig%5cconfig.json then there is no problem. It would be proper if esri fixed the code that adds applicationUrl so that it is properly encoded, i.e. encodeURI(window.location.href). You cannot rely on the fact that the client will validate the url parameter. If you look at past WAB functionality, it accepted non-encoded or escaped backslashes as config parameters.

‎12-01-2023

I narrowed it down to JSON.parse() not liking the double backslash \\. When the user opens a url: http://localhost:5173/?locale=fr&config=assets\config\config.json what gets input into the applicationURL of esriConfig is http://localhost:5173/?locale=fr&config=assets\\config\\config.json. My workaround is to use the following url: http://localhost:5173/?locale=fr&config=assets%5cconfig%5cconfig.json however, it is less user-readable and depends on user validation. Is it possible for you to modify your code to encodeURI(window.location.href) as the value you put into applicationURL so this exception will not happen in most case-scenarios?

‎12-01-2023

Here are more details with exception code attached:

‎12-01-2023

I have this same issue. It does not correctly parse the = character because if I replace the value with %3d in the URL it will work fine. Has anyone looked into this issue? Does esriConfig require the full URL in applicationURL or can it take the URL before the querystring?

‎12-01-2023

Hi all, I am receiving multiple worker exceptions when the mapview loads. It does not affect anything as I believe the issue is in logger. My site supports locale and config as querystring parameters. Adding the config parameter seems to trigger the issue. Example: http://localhost:5173/?locale=fr&config=assets\config\config.json causes the issue but http://localhost:5173/?locale=fr does not. I have also tried http://localhost:5173/?locale=fr&config=assets%5cconfig%5cconfig.json but that made no difference. My config file still loads up fine in the javascript either way. let globalId=0;const outgoing=new Map,configuration=JSON.parse('{"esriConfig":{"applicationName":"","applicationUrl":"http://localhost:5173/?locale=fr&config=assets\\config\\config.json","assetsPath":"https://js.arcgis.com/4.28/@arcgis/core/assets","fontsUrl":"https://static.arcgis.com/fonts","geometryServiceUrl":"https://utility.arcgisonline.com/arcgis/rest/services/Geometry/GeometryServer","geoRSSServiceUrl":"https://utility.arcgis.com/sharing/rss","kmlServiceUrl":"https://utility.arcgis.com/sharing/kml","userPrivilegesApplied":true,"portalUrl":"https://nsdnr-forestry.maps.arcgis.com","routeServiceUrl":"https://route-api.arcgis.com/arcgis/rest/services/World/Route/NAServer/Route_World","workers":{"loaderConfig":{"has":{},"paths":{},"map":{},"packages":[]},"workerPath":"https://js.arcgis.com/4.28/@arcgis/core/assets/esri/core/workers/RemoteClient.js","useDynamicImport":false},"request":{"crossOriginNoCorsDomains":null,"httpsDomains":["arcgis.com","arcgisonline.com","esrikr.com","premiumservices.blackbridge.com","esripremium.accuweather.com","gbm.digitalglobe.com","firstlook.digitalglobe.com","msi.digitalglobe.com"],"interceptors":[],"maxUrlLength":2000,"priority":"high","proxyRules":[],"proxyUrl":null,"timeout":60000,"trustedServers":[],"useIdentity":true},"log":{"interceptors":[],"level":null},"defaultAssetsPath":"https://js.arcgis.com/4.28/@arcgis/core/assets","locale":"fr","has":{"esri-csp-restrictions":false,"esri-2d-debug":false,"featurelayer-pbf":true,"featurelayer-simplify-thresholds":[0.5,0.5,0.5,0.5],"featurelayer-simplify-payload-size-factors":[1,1,4],"esri-atomics":true,"esri-shared-array-buffer":false,"esri-workers-arraybuffer-transfer":true,"feature-polyline-generalization-factor":1,"host-webworker":1}},"loaderConfig":{"async":true,"isDebug":false,"locale":"fr","has":{"csp-restrictions":1,"dojo-test-sniff":0,"host-webworker":1},"map":{},"packages":[],"paths":{}},"kernelInfo":{"buildDate":"20231115","fullVersion":"4.28.10","revision":"a6fcf2901ef678ef17a528e11b93ffe09e3ec267"}}');self.esriConfig=configuration.esriConfig;const workerPath=self.esriConfig.workers.workerPath,HANDSHAKE=0,OPEN=1,OPENED=2,RESPONSE=3,INVOKE=4,ABORT=5;function createAbortError(){const e=new Error("Aborted");return e.name="AbortError",e}function receiveMessage(e){return e&&e.data?"string"==typeof e.data?JSON.parse(e.data):e.data:null}function invokeStaticMessage(e,o,r){const t=r&&r.signal,n=globalId++;return new Promise(((r,s)=>{if(t){if(t.aborted)return s(createAbortError());t.addEventListener("abort",(()=>{outgoing.get(n)&&(outgoing.delete(n),self.postMessage({type:ABORT,jobId:n}),s(createAbortError()))}))}outgoing.set(n,{resolve:r,reject:s}),self.postMessage({type:INVOKE,jobId:n,methodName:e,abortable:null!=t,data:o})}))}let workerRevisionChecked=!1;function checkWorkerRevision(e){if(!workerRevisionChecked&&e.kernelInfo){workerRevisionChecked=!0;const{revision:o,fullVersion:r}=configuration.kernelInfo,{revision:t,fullVersion:n,version:s}=e.kernelInfo;esriConfig.assetsPath!==esriConfig.defaultAssetsPath&&o!==t&&console.warn(`Version mismatch detected between ArcGIS Maps SDK for JavaScript modules and assets. For more information visit https://bit.ly/3QnsuSo.\nModules version: ${r}\nAssets version: ${n??s}\nAssets path: ${esriConfig.assetsPath}`)}}function messageHandler(e){const o=receiveMessage(e);if(!o)return;const r=o.jobId;switch(o.type){case OPEN:let n;function t(e){const o=n.connect(e);self.postMessage({type:OPENED,jobId:r,data:o},[o])}"function"==typeof define&&define.amd?require([workerPath],(e=>{n=e.default||e,checkWorkerRevision(n),n.loadWorker(o.modulePath).then((e=>e||new Promise((e=>{require([o.modulePath],e)})))).then(t)})):"System"in self&&"function"==typeof System.import?System.import(workerPath).then((e=>(n=e.default,checkWorkerRevision(n),n.loadWorker(o.modulePath)))).then((e=>e||System.import(o.modulePath))).then(t):esriConfig.workers.useDynamicImport?import(workerPath).then((e=>{n=e.default||e,checkWorkerRevision(n),n.loadWorker(o.modulePath).then((e=>e||import(o.modulePath))).then(t)})):(self.RemoteClient||importScripts(workerPath),n=self.RemoteClient.default||self.RemoteClient,checkWorkerRevision(n),n.loadWorker(o.modulePath).then(t));break;case RESPONSE:if(outgoing.has(r)){const s=outgoing.get(r);outgoing.delete(r),o.error?s.reject(JSON.parse(o.error)):s.resolve(o.data)}}}self.dojoConfig=configuration.loaderConfig,esriConfig.workers.loaderUrl&&(self.importScripts(esriConfig.workers.loaderUrl),"function"==typeof require&&"function"==typeof require.config&&require.config(configuration.loaderConfig)),self.addEventListener("message",messageHandler),self.postMessage({type:0});

‎11-09-2023

Hi @Noah-Sager, I have been looking into the Calcite components with React while using TypeScript. I looked at map-components, and while they seem easy, I need a much more fine-grained approach to handle locales and extending the existing functionality. I am probably going to stick to the ViewModels. It would be nice to hear what other people have to say...

‎11-07-2023

Hi Everyone, Looking for some advice on next moves. I have spent a lot of time on our current "WAB-like" application. I have hit the proverbial wall at 4.26.5 whereby next steps are a rethink of the application. The current application uses Typescript, React and Webpack. My custom widgets extend Widget (which I saw is not recommended at 4.27+). I have seen map-components, etc. and am trying to get a feel on current best practices. What are people using out there that is more supported within the esri community? We have many complex custom widgets created that I will need to get up and running. Any suggestions would be greatly appreciated! Thanks, René

‎10-30-2023

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.

‎10-27-2023

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); });

‎09-14-2023

Don't worry @DanielBrumm1 I also feel like a fish out of water when it comes to these expressions... Any examples are greatly appreciated! R.

‎09-12-2023

Hi @GeoJosh , I submitted a case with esri Canada Case #03431301 Thanks, René

Online Status	Offline
Date Last Visited	a month ago

My Ideas

Latest Contributions by René_Ténière

Re: Change LayerList Widget Scale

CalcitePopover Add a header slot

Change LayerList Widget Scale

Re: Windows Host Component Reboot Metric

Re: Bad escaped character in JSON: esriConfig

Re: [esri.core.workers] Failed to create Worker. JSON Parse failing on 'applicationURL'

Re: [esri.core.workers] Failed to create Worker. JSON Parse failing on 'applicationURL'

Re: [esri.core.workers] Failed to create Worker. JSON Parse failing on 'applicationURL'

Bad escaped character in JSON: esriConfig

Re: Javascript 4.27+ Migration Tips

Javascript 4.27+ Migration Tips

Re: 4.26 to 4.28 upgrade of Expand widget containing a BasemapGallery widget not rendering upon expand

4.26 to 4.28 upgrade of Expand widget containing a BasemapGallery widget not rendering upon expand

Re: Data Expression Question

Re: Collection Advanced Expression Builder Help

Re: ArcGIS Monitor 2023 - Mass label application, ...

Re: Bad escaped character in JSON: esriConfig

Javascript 4.27+ Migration Tips

Re: 4.26 to 4.28 upgrade of Expand widget containi...

Re: Data Expression Question