nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

ArcGIS WebAppBuilder widget config

RuchiraWelikala

I downloaded a webapp builder template (javascript) that I've placed on my own web server and is running fine. However, I am not able to modify the widgets in the config.json file to the settings that I want. For instance, I want the "Coordinate" widget to have meters instead of feet, however, when I adjust the config.json file in the widget file, these changes aren't reflect. Has anyone encountered this issue? I may be doing it all wrong so if someone can point me in the right direction, that would be much appreciated. I read the webapp builder documentation (http://doc.arcgis.com/en/web-appbuilder/extend-apps/coordinate.htm) but can't seem to figure it out.

This is the json in the current config file (for the app itself, not just the widget):

<SPAN class="pln" style="color: #000000;">&nbsp; </SPAN><SPAN class="pun" style="color: #145680;">{</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"label"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"Coordinate"</SPAN><SPAN class="pun" style="color: #145680;">,</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"uri"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"widgets/Coordinate/Widget"</SPAN><SPAN class="pun" style="color: #145680;">,</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"position"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">{</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"left"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="lit" style="color: #953838;">200</SPAN><SPAN class="pun" style="color: #145680;">,</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"bottom"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="lit" style="color: #953838;">20</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">},</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"config"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">{}</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">}</SPAN>

This is the json in the widget config file:

<SPAN class="pun" style="color: #145680;">{</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"outputunit"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"dms"</SPAN><SPAN class="pun" style="color: #145680;">,</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="str" style="color: #800000;">"spatialReferences"</SPAN><SPAN class="pun" style="color: #145680;">:</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">[]</SPAN><SPAN class="pln" style="color: #000000;"> </SPAN><SPAN class="pun" style="color: #145680;">}</SPAN>

The latter says DMS but the units still show up as feet.

Anyway, any help would be appreciated.

Thank you

Find more posts tagged with

Accepted answers

RobertScheitlin__GISP

Ruchira,

What is the path to the config file that is listed in the apps main config.json? Like this example:

{
        "label": "Coordinate",
        "uri": "widgets/Coordinate/Widget",
        "position": {
          "left": 200,
          "bottom": 20
        },
        "id": "widgets/Coordinate/Widget_4",
        "positionRelativeTo": "map",
        "name": "Coordinate",
        "config": "widgets/Coordinate/config_Coordinate.json"
      },

Notice the config path is "widgets/Coordinate/config_Coordinate.json". What does yours look like?

All comments

RuchiraWelikala

Oh wow! That did it. I didn't have the config property set to point to the json file!

Thank you so much for your help, Robert. I really appreciate it!

RobertScheitlin__GISP

Ruchira,

What is the path to the config file that is listed in the apps main config.json? Like this example:

{
        "label": "Coordinate",
        "uri": "widgets/Coordinate/Widget",
        "position": {
          "left": 200,
          "bottom": 20
        },
        "id": "widgets/Coordinate/Widget_4",
        "positionRelativeTo": "map",
        "name": "Coordinate",
        "config": "widgets/Coordinate/config_Coordinate.json"
      },

Notice the config path is "widgets/Coordinate/config_Coordinate.json". What does yours look like?

RuchiraWelikala

Thanks for your reply, Robert.

I think the download option is only available for those who are signed up for the beta program. However, I'm just using the Web App Builder on AGO. I can't configure an app on there the way I want and then download that app to deploy on my own web server. Not that I can see, anyway.

Also, I tried implementing your code into the template I downloaded (the webapp template) but still doesn't seem to work.

Basically, I modified "webapp\widgets\Coordinate\config.json" to include your code and it doesn't seem to get reflected on my map.

RobertScheitlin__GISP

Ruchira,

Not sure why you are not using the Web AppBuilder to do this configuration for you... Sounds like you are just taking the StemApp and deploying it to your web server. Here is what the json should look like for the coordinate widget.

{
  "outputunit": "dms",
  "spatialReferences": [
    {
      "wkid": "3857",
      "label": "WGS_1984_Web_Mercator_Auxiliary_Sphere",
      "outputUnit": "",
      "transformationWkid": "",
      "transformationLabel": "",
      "transformForward": false
    },
    {
      "wkid": "102629",
      "label": "NAD_1983_StatePlane_Alabama_East_FIPS_0101_Feet",
      "outputUnit": "FOOT",
      "transformationWkid": "",
      "transformationLabel": "Transformation Name",
      "transformForward": false
    }
  ],
  "decimalPlaces": 3,
  "addSeparator": false
}

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.