Latest Contributions by ReneRubalcava

‎04-03-2025

You can declare this on the global type in your app export declare global { // maybe this // var $arcgis: { import<T>?: (modules: string[]) => Promise<T> | null }; var $arcgis: { import?: (modules: string[]) => Promise<unknown> | null }; }

‎04-03-2025

Unit tests and SSR are run in node, so you need to handle those use cases when using parts of the JS Core that use UI. In unit tests, you will need to set up mocks for your modules that use JS Core widgets/views. Or maybe have some factory methods you can mock. In SSR, you can try to move all UI modules to a helper module that can exposes a function that can take the containers for your views and widgets. Then you can dynamically load this module via `import("./helper.js")`. This will avoid the SSR issues.

‎04-02-2025

You can do this by listening for the sources collection to change. https://codepen.io/odoe/pen/gbOqrXv?editors=1000 const searchElement = document.querySelector("arcgis-search"); // component loaded, might still be loading data await searchElement.componentOnReady(); searchElement.allSources.on("change", () => { searchElement.allSources.forEach((source) => { source.zoomScale = 100000; }); });

‎04-02-2025

This is currently a known limitation with the "position" that we are looking to fix for next release. In later releases we will be adding slots to better manage this. For now, you can use the arcgis-placement component and your own container styled how you like to accomplish this. https://codepen.io/odoe/pen/yyLGdXa?editors=1000 <arcgis-map item-id="45725ba7d9fb47a0925398919b13d1fa"> <arcgis-placement position="bottom-left"> <div class="tool-container"> <arcgis-zoom layout="horizontal"></arcgis-zoom> <arcgis-expand expand-icon="esri-icon-layers" expand-tooltip="Layers" collapse-icon="chevrons-down" collapse-tooltip="Layers" label="Layers" placement="top-leading" close-on-esc> <arcgis-layer-list label="Current layers" show-heading></arcgis-layer-list> </arcgis-expand> <arcgis-expand expand-icon="measure" expand-tooltip="Measure distance" collapse-icon="chevrons-down" collapse-tooltip="Measure distance" label="Measure distance" placement="top-leading" close-on-esc> <arcgis-distance-measurement-2d unit="meters"></arcgis-distance-measurement-2d> </arcgis-expand> <arcgis-scale-bar bar-style="ruler" unit="metric"></arcgis-scale-bar> </div> </arcgis-placement> </arcgis-map>

‎03-31-2025

Do you have a github repo or similar to review? You only need the wrappers for React 18 and I don't have an app on hand to test with.

‎03-28-2025

There's a couple of ways you could do this. Create a custom basemap and assign it to element.map.basemap. Create a map with custom basemap and assign the map the element.map Here is a demo with second option. It's really a preference on your part. https://codepen.io/odoe/pen/emYPBBB?editors=1000 const ArcGISMap = await $arcgis.import("@arcgis/core/Map.js"); const VectorTileLayer = await $arcgis.import("@arcgis/core/layers/VectorTileLayer.js"); const Basemap = await $arcgis.import("@arcgis/core/Basemap.js"); const mapBaseLayer = new VectorTileLayer({ url: "https://arcgis.com/sharing/rest/content/items/b5676525747f499687f12746441101ef/resources/styles/root.json" }); const customBasemap = new Basemap({ baseLayers: [mapBaseLayer], title: "Terrain", id: "terrain", thumbnailUrl: "https://arcgis.com/sharing/rest/content/items/b5676525747f499687f12746441101ef/info/thumbnail/ago_downloaded.png" }); const sceneElement = document.querySelector("arcgis-scene"); await sceneElement.componentOnReady(); sceneElement.map.basemap = customBasemap;

‎03-28-2025

The layer name comes from the "layer.title", so you can add your own title when you create the layer.

‎03-27-2025

If you could provide a repro to look at, would be easier to see the problem. If I had to guess, your `<app-esri-map>` element needs a height and width in css. The `<arcgis-map>` component will grow to the size of it's container, so the container probably doesn't have them.

‎03-20-2025

I don't think you'll be able to target individual expands like that... yet. Right now the arcgis-expand creates an element with the class ".esri-expand" and places that element in the view.ui. So the actual arcgis-expand element you created is not in the view.ui. I don't think there is an easy way with css to target multiples of these same type of elements. In a future release we will be using slots to position these elements which will make it easier.

‎03-20-2025

If you can provide a github repo showing the issue, might be able to help. From your snippet, I'm not sure why you're creating a new MapView and using components, it should be one or the other. If you use React 19, you don't need the map-components-react package. Here is a React 19 sample https://github.com/Esri/jsapi-resources/tree/main/component-samples/map-components/samples/react

‎03-06-2025

Do you have a reproducible sample? This looks like you may need to update your calcite version as well. 4.32 uses 3.0.3 of calcite https://developers.arcgis.com/javascript/latest/release-notes/#additional-packages

‎03-05-2025

Do you have a code sample, codepen, or github of what you are trying to do? Custom Content is defined on the PopupTemplate and Feature displays that info.

‎03-05-2025

Short answer, no, but it's under consideration. https://community.esri.com/t5/arcgis-javascript-maps-sdk-blog/arcgis-maps-sdk-for-javascript-version-4-32/bc-p/1589690/highlight/true#M244

‎02-26-2025

All of the components have a referenceElement property and reference-element attribute so it does not need to be inside a map component. https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-basemap-gallery/#referenceElement That can be the id to the arcgis-map component. Here is a blog post that might be useful. https://www.esri.com/arcgis-blog/products/js-api-arcgis/developers/build-gis-web-apps-with-javascript-maps-sdk-components/

‎02-26-2025

I suppose there's a couple of ways you can do this. You can update the source on the BasemapGallery element https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-basemap-gallery/ <arcgis-map item-id="06ca49d0ddb447e7817cfc343ca30df9"> <arcgis-basemap-gallery position="top-right"></arcgis-basemap-gallery> </arcgis-map> // in your app somewhere import LocalBasemapsSource from "@arcgis/core/widgets/BasemapGallery/support/LocalBasemapsSource.js"; const bmgElement = document.querySelector('arcgis-basemap-gallery'); bmgElement.source = new LocalBasemapsSource({ basemaps }); If you want to do it all via JS import LocalBasemapsSource from "@arcgis/core/widgets/BasemapGallery/support/LocalBasemapsSource.js"; const bmgElement = document.createElement('arcgis-basemap-gallery'); bmgElement.position = "top-right"; bmgElement.source = new LocalBasemapsSource({ basemaps }); document.querySelector('arcgis-map').appendChild(bmgElement);

Online Status	Online
Date Last Visited	6 hours ago

My Ideas

Latest Contributions by ReneRubalcava

Re: TypeScript errors when using $arcgis.import

Re: Unable to import symbolUtils

Re: Map components Search zoom scale?

Re: How to fix the visual order of components on a map using arcgis-map-components

Re: Expand Arcgis component does not show expandTooltip with ArcgisBasemapGallery

Re: Map Component using custom Basemap

Re: How to change layer name using map components

Re: Map doesn't show in browser. using map components, calcite components with Angular.

Re: New to Components. How To Manually Set Expand Component Position and Color

Re: How display map tools with @arcgis/map-components-react

Re: Upgrade to ArcGIS/core 4.32.6 Eliminated Popup Title Margin

Re: CustomContent in Feature component

Re: How to Check Changes for ArcGIS JS API Subversion (e.g., 4.32.x)?

Re: How to create a component in 4.32 like creating a widget before

Re: How to create a component in 4.32 like creating a widget before

Re: Trouble Using Reactive Utils On Initially Unde...

Re: Custom Component Shadow DOM not fully loaded o...

Re: Custom Component Shadow DOM not fully loaded o...

Re: syntax error in SceneView.js

Re: Has anyone ever used Grit to convert standard ...