Accessing Map Widget (WebMap) Reference in a Custom Widget in Experience Builder
Accepted Solutions
Your file structure is incorrect. The setting folder must be directly under the src folder. Experience Builder is highly opinionated and will not find files or folders if they are not placed in the correct place with the correct name.
I have not reviewed your code closely, so there could be other issues as well.
I'll ask a few clarifying questions until @JeffreyThompson2 can chime in.
You mention in a custom widget you want to reference maps. The map URLs used in WepAppBuilder should reside at the same place as they did before, you just need to add them as a map or datasource in the editor part of ExperienceBuilder.
I beleive Jeffrey has a post over here that may be related: https://community.esri.com/t5/arcgis-experience-builder-questions/how-to-get-the-data-source-for-add...
I'm not sure how you had WAB deployed, if its in portal itself, or on a standalone server.
if its a stand alone server you might look in the folder where ArcGISWebAppBuilder\server\apps\{number for the app}|\config.json for something that looks like this:
"map": {
"3D": false,
"2D": true,
"position": {
"left": 0,
"top": 0,
"right": 0,
"bottom": 0
},
"itemId": "6a749c0dd65b4592ae3814df0500db7b",
"mapOptions": {},
"id": "map",
"portalUrl": "https://exampleurl.com",
"mapRefreshInterval": {
"useWebMapRefreshInterval": true
}
the itemId would trace to what item in the portal it is. from there you might be able to find the full url EXB needs to connect and use the map as a data source. (I think there is another variant where the url is fully there under an "operationalLayers" key, but I don't have a local example I can refer to.
So I think i read somewhere you could then take the id: https://www.arcgis.com/home/webmap/viewer.html?webmap=6a749c0dd65b4592ae3814df0500db7b
whatever that ID is might be the reference you are looking for?
IN theory if this is in your AGOL or AGE Portal you could search for it there, and open the page for it and find the information
So for example that would show up here:
For other data sources, like Feature layers there will be a box on the right hand side with a URL you can open or copy paste to verify its the same service for a given data source.
Those can then in theory be added to the EXB through the Add Sources panel.
You can look for this icon on the left side of EXB when editing:
editor part of Experience Builder.
and then either add Data from there:
or
from select map on the right (after clicking on the map you need to add:
If you don't have one already added you click add Data which takes you to a dialog that has this at the top:
You can then browse under My Content, My Groups, My Organization, etc. (Which maps with what you'd see in Portal under Content), and find the map in question, and it adds it automatically
Let us know if this does not fully answer the question, as it may be there is more to what you are asking than just connecting an existing widget.
For a custom widget, you may want to read up on how to create a settings section for your widget
Have you already tried the starter widget?
https://developers.arcgis.com/experience-builder/guide/create-a-starter-widget/
And
https://developers.arcgis.com/experience-builder/guide/get-map-coordinates/ (this has notes about the settings panel)
(There is a lot to learn with custom widgets, but it may be you need to look at how to setup a widget settings section, to learn how to setup your own control to select the Map from what is available on the given portal)
I have followed this => https://developers.arcgis.com/experience-builder/guide/get-map-coordinates/ (this has notes about the settings panel)
but there is no map option inside the right panel of the custom widget, i have restarted the client as well.
My code Hirerchy
widget.jsx
Your file structure is incorrect. The setting folder must be directly under the src folder. Experience Builder is highly opinionated and will not find files or folders if they are not placed in the correct place with the correct name.
I have not reviewed your code closely, so there could be other issues as well.
@JeffreyThompson2 , @TimWestern
Thank you both for help.
Finally, Map option appeared, there are two options , none and map and i have selected Map, and now i have the map object in jimuMapView (state variable).
