Create and style a web map

First, you'll add relevant data layers to a blank web map: farmers markets, DC retail locations that accept SNAP (Supplemental Nutrition Assistance Program), poverty status, and race and Hispanic origin. Then, you'll begin symbolizing the layers to effectively show the data for your area of interest, Washington, DC. Your map will show farmers markets symbolized by what benefits they currently accept, as well as where they are in relation to other retailers, poverty rates, and the racial and ethnic composition of the community.

Add farmers market and SNAP retail data to a new map 

To fully understand the scope of the issue, you want to map where in the Washington, DC, area fresh food is being sold. You'll add data from ArcGIS Living Atlas of the World to show where farmers markets are, as well as stores that accept SNAP or WIC.

  1. Sign in to your ArcGIS organizational account.

    If you don't have an organizational account, you can sign up for an ArcGIS free trial.

  2. On the ribbon, click the Map tab.

    Depending on your organizational and user settings, you may have opened Map Viewer Classic. ArcGIS Online offers two map viewers for viewing, using, and creating maps. For more information on the map viewers available and which to use, please see this FAQ.

    This lesson uses Map Viewer.

  3. If necessary, in the pop-up window, click Open in Map Viewer or on the ribbon, click Open in Map Viewer.

    Map Viewer opens.

  4. Read the pop-up and click OK.
  5. On the Settings (light) toolbar, click Map tools and click Search.

    Search button

    The search box appears at the top of the map pane.

  6. In the search box, type Washington, D.C. and press Enter.

    Map zoomed to the Washington, DC search result

    The map zooms to the Washington, DC, area. Next you'll add data to the map.

  7. Close the search results pop-up.
  8. If necessary, on the Contents (dark) toolbar, click Layers.
  9. In the Layers pane, click Add layer.

    Add layer button in the Layers pane

    The Add layer pane appears. The layer you want to add is stored in ArcGIS Online.

  10. In the Add layer pane, click My Content and choose ArcGIS Online.

    Add layer pane with search options

  11. In the Search bar, type USDA farmers market directory owner:Learn_ArcGIS and press Enter.
  12. Click the USDA Farmers Market Directory layer search result to view the item details.

    The item’s description appears in the pane. This layer shows a subset of the full directory showing farmers markets as of March 2, 2020. While the layer has been modified more recently, the data itself is as of March 2, 2020.  Because many farmers markets shut down during the pandemic, you're using this older view of the data to have a better idea of access when farmers markets are fully open.

  13. Click Add to map.

    Add to map button for farmers market data

    The layer is added to the map. Farmers markets are currently symbolized as green points. Before you start symbolizing these points, you'll change the basemap. If your organization is set up to use the default Topographic basemap, it shows both human features, such as roads and neighborhoods, and natural features, such as elevation and green space. You'll select a neutral basemap so the data on the map is more distinct.

  14. On the Contents toolbar, click Basemap and choose Human Geography Map.

    Human Geography Map basemap option

    The Human Geography basemap displays state and county boundaries as well as highways and other infrastructure, providing context.

    Map with new basemap

    Next, you'll add a layer showing stores in the area that accept food assistance programs.

  15. On the Contents toolbar, click Layers. In the Layers pane, click Add layer.
  16. In the Add layer pane, search ArcGIS Online for SNAP Store Locations owner:Learn_ArcGIS.
  17. For the SNAP Store Locations search result, click Add.

    Add button for SNAP Store Locations layer

    The SNAP Store Locations layer is added to the map. You can now see where food stores are that accept food assistance programs.

Filter data

Your map now contains two layers showing where stores are that accept food assistance and farmers markets. This data extends beyond the Washington, DC, city limits. You'll filter the features in these two layers to show only the data you need.

  1. In the Add layer pane, click the back arrow to return to the Layers pane. Ensure that the SNAP Store Locations layer is selected.
  2. On the Settings toolbar, click Filter.

    Filter button on the Settings toolbar

    The Filter pane appears. In this pane, you can build expressions to select data to show or hide from the selected layer. In this case, you want to select all stores within the boundaries of the District of Columbia, so you'll build the expression State is D.C.


    The city of Washington, DC, is formally known as the District of Columbia, and is considered a state equivalent in this layer.

  3. In the Filter pane, click Add expression.

    Add expression button in Filter pane

  4. For Expression, click the first box. From the attribute list, choose State and click Replace.

    Replace field window with the State attribute selected and the Replace button highlighted

    The first box of the expression now reads State. In the second box, you can choose an operator, and in the final box, you can choose an attribute value.

  5. Ensure that the second box reads is. In the third box, type DC.

    Filter expression


    To see the attribute values that can be selected, click the arrow for the third box.

    The filter is automatically applied, and store locations not within the boundaries of Washington, DC, are unavailable. Once you confirm this is the filter you want to apply, you'll save the results.

  6. In the Filter pane, click Save.

    Filtered map results of SNAP store locations

    The map shows only stores within the boundaries of Washington, DC. You'll repeat this process to filter farmers markets. First, you'll need to change the active layer, then you can apply the second filter.

  7. On the Settings toolbar, click Filter.
  8. At the top of the Filter pane, click SNAP Store Locations.

    Active layer selected for the Filter pane

  9. For Layers, choose USDA Farmers Market Directory.

    The farmers market layer is now active, and any filters you create will apply to this layer.

  10. In the Filter pane, click Add expression and build the expression State is District of Columbia.
  11. Click Save.

    Both layers filtered to the Washington, DC, border

    Even with the data filtered, the store locations layer still covers up the farmers markets. You'll reorder these in the Layers pane.

  12. In the Layers pane, drag the USDA Farmers Market Directory layer above the SNAP Store Locations layer.

    This changes the order that these features draw on the map. You now see the farmers markets drawing on top of the SNAP store locations. Your focus is on the farmers markets, so having them draw on top makes them display more prominently.

Symbolize SNAP Store Locations

Your map now shows the two layers that show the location of fresh food in the DC area. Both are shown with default symbology, making it difficult to do visual analysis. You’ll start by symbolizing the store locations so you can see the farmers markets better.

  1. In the Layers pane, click SNAP Store Locations layer to make it the active layer.
  2. On the Settings toolbar, click Styles.

    Styles button in the Settings toolbar

    By default, the layer draws as a single symbol. You'll change this symbol to something less busy than the current icon.

  3. For Pick a style, on the Location (single symbol) card, click Style options.

    Style options button for the Location (single symbol) style

    The Style options pane appears.

  4. In the Style options pane, click the symbol under Symbol style.

    The Symbol style window appears, where you can control the shape, size, color, and other characteristics of the symbol. You'll start by changing the shape of the symbol.

  5. For Current symbol, click Basic point. In the Basic shapes category, click the circle symbol and click Done.

    The map updates to show the new circle symbol. At the current size, they cover the basemap, making it difficult to tell where they're located. You'll resize the symbol.

  6. For Size, change the symbol size to 6.

    Next, you'll change the color to a dark navy blue.

  7. For Fill color, click the color swatch. For Hex, type 002673 and press Enter.

    Custom color set with hex color code for navy blue

  8. Click Done.

    Finally, you'll remove the outline.

  9. For Outline color, click the none button next to the color choices.

    Outline color set to none

  10. Click Done in both style panes.

    Symbolized store locations on the map

    The SNAP Store Location layer is now symbolized as small blue points on the map. These represent retailers that accept SNAP benefits. Click a few features in the map to see the pop-ups.

Create custom symbology with an Arcade expression

Now you will symbolize the farmers markets. Instead of simply showing the location of farmers markets, you will use color to depict which types of public assistance benefits they accept. For this lesson, the two programs you will consider are SNAP, which serves low-income families, and WIC, which serves low-income pregnant and postpartum women and children under the age of fiveArcGIS Arcade expressions allow you to work with the data in your layers in a flexible way. You will use if/else logic to combine these two attributes.

  1. In the Layers pane, click USDA Farmers Market Directory to make it the active layer.

    Before symbolizing the layer, you'll open the attribute table to see what data is available to work with.

  2. For USDA Farmers Market Directory, click Options and choose Show table.

    The table appears at the bottom of the map window.

  3. Scroll until you see the WIC and SNAP attributes.

    SNAP and WIC attributes highlighted in the farmers market table

    There are several attributes describing additional food assistance programs. For this lesson, you'll focus on SNAP and WIC. Each market is marked with a Y if they accept the program, and an N if they don't accept the program. You'll use these attributes and their values in the Arcade expression.

  4. Close the table.
  5. If necessary, in the Settings toolbar, click Styles.
  6. For Choose attributes, click + Expression.

    The New expression window appears. You'll create a variable called category that will take on different values for the different farmers markets depending on what combination of SNAP and WIC benefits are accepted (both, SNAP but not WIC, WIC but not SNAP, and neither).

  7. Click the Edit button next to New expression and name the expression Public assistance category. Click Save.

    New expression name with the Save button highlighted

    The expression will use if/else logic. If the first condition is met (both are accepted), your new variable category will be assigned the value of "Both SNAP and WIC accepted", otherwise, the second condition will be tested, and so on. If no conditions are met, the final else statement assigns the value of "Neither SNAP nor WIC accepted".  Finally, you'll use the return function.

  8. Delete the first three lines of script and type or paste the following into the Arcade Expression window:
    var category
    if ($feature.WIC == "Y" && $feature.SNAP == "Y") {
    Category = "Both SNAP and WIC accepted"
    else if ($feature.WIC == "N" && $feature.SNAP == "Y") {
    Category =  "SNAP accepted but not WIC"
    else if ($feature.WIC == "Y" && $feature.SNAP == "N") {
    Category = "WIC accepted but not SNAP"
    else category = "Neither SNAP nor WIC accepted"
    return category


    You can click the SNAP and WIC attributes in the Globals tab to add them to your expression.

  9. Click Test to see a result to check for any syntax errors.

    Test button highlighted for the expression


    If you paste the expression, verify that the quotation marks are all straight. Curly quotation marks may cause the expression to fail. You can fix this by retyping them directly into the Arcade editor.

    The Results and Messages tabs appear. The result shows one of the categories specified in the script.

  10. Click OK.

    Arcade expression symbolized on the map

    The map now shows the farmers markets points colored based on these categories that you created through your expression that combined two attributes together. Smart mapping picked up on these being string values (categories) and suggested the symbology style of Types. Notice that there are no locations that accept SNAP but not WIC.

  11. For Pick a style, on the Types (unique symbols) card, click Style options.

    To differentiate these from the store locations, you'll choose a different shape for these symbols.

  12. Click Symbol style. In the Symbol style window, click the current symbol. In the Basic shapes category, click the diamond shape and click Done.
  13. Change the symbol size to 16.
  14. Click the Fill color edit button. In the Ramp pane, click Flip ramp colors and choose the Fruit Basket color ramp.

    Point to the color ramp to see the name.

    Flip ramp colors and Fruit Basket options highlighted

  15. Click Done in both style panes.

    Now the points are all symbolized how you want them to appear on your final map.

  16. On the Contents toolbar, click Legend.

    Symbolized map with the legend

  17. On the Contents toolbar, click Save and open and click Save as.
  18. In the Save map window, enter the following information:

    • TitleFarmers Market food access
    • TagsFood access, food assistance, WIC, SNAP
    • SummaryThis map shows the location of farmers markets in Washington D.C. that accept two forms of food assistance, SNAP and WIC.

  19. Click Save map.

Add contextual layers from ArcGIS Living Atlas

Now that the two layers showing fresh food market locations are symbolized, you'll add contextual layers showing poverty, race and ethnicity, and the district boundary from ArcGIS Living Atlas.


SNAP eligibility includes income levels up to 130 percent of the Federal Poverty Level and WIC eligibility includes income levels up to 185 percent of the Federal Poverty Level, which means there are individuals and families with incomes slightly above the Federal Poverty Level who can still benefit from SNAP and WIC. For this lesson, you will only analyze the Poverty Status layer from ArcGIS Living Atlas, which will still provide important context as to spatial patterns of farmers markets throughout the District of Columbia. You may consider using the Median Household Income layer to calculate eligibility based on a household size of four on your own.

  1. On the Contents toolbar, click Layers. In the Layers pane, click Add layer. Click My Content and choose Living Atlas.
  2. Search for Poverty status. In the search results, click Add for the ACS Poverty Status Variables – Boundaries layer owned by Esri.
  3. In the Layers pane, click the back button and expand the new group layer that was added to your map.

    The group layer contains three layers: State, County, and Tract.

  4. In the Layers pane, drag the USDA Farmers Market Directory and SNAP Store Locations layers above the ACS Poverty Status layer so they appear in the map.

    Tract level ACS poverty data shown in the map

    The legend that appears in the Properties pane shows that darker pink tracts have higher percentages of population whose income is below poverty level. Currently, the tract level is visible because your map is zoomed in to a city. If you zoom out, you'll see the county and state level data. For this lesson, you'll use the tract and state level layers.

  5. For the County layer, click Options and choose Remove.

    There are now three visible layers on your map showing farmers market data, store location point data, and the tract level poverty data. This poverty rate data is helpful contextual information, but you don't want it to reduce the visibility of the point data on the map. You'll use transparency to blend the data into the basemap so it's visible but doesn't block the point data.

  6. In the Properties pane, choose the Tract layer. In the Appearance section, change Transparency to 65%.

    Transparency set to 65 percent

    Like the SNAP retail locations, this is supporting information to the farmers markets. The transparency allows the poverty information to come through without overwhelming the map. Now, you'll symbolize the State layer.

  7. At the top of the Properties pane, change the layer to the State layer to make it the active layer.

    The State layer isn't currently visible because its visibility range is set to very small zoom extents—you can only see it if you're zoomed out to look at the entire United States. You'll change this so the data can be seen at all scales and symbolize the layer.

  8. For Visible range, drag the second handle of the slider to the opposite end of the scale.

    Visible range updated for the layer

    Now the layer is visible at all scale extents and covers the tract level layer you already symbolized. You'll use this layer to help make the District of Columbia (your area of interest) more distinct from the surrounding area on the map.

  9. On the Settings toolbar, click Filter.
  10. Click Add expression and build the expression Name is not District of Columbia.
  11. Click Save.
  12. On the Settings toolbar, click Styles. For Pick a style, scroll down and click Location (single symbol).
  13. On the Location (single symbol) card, click Style options.
  14. Click Symbol style. For Fill color, type the Hex value c8c8c8 and press Enter to change it to a light gray.
  15. Click Done.

    You see the district through the dark gray state boundary with the filter applied.

    All states filtered out of map except for District of Columbia

  16. Click Done in both style panes.
  17. In the Layers pane, for the State layer, click Options and choose Rename. Rename the layer District Boundary and click OK.
  18. Save the map.

Map race and ethnicity

The final contextual layer you'll add from ArcGIS Living Atlas will show race and ethnicity. After adding it to the map, you'll apply a similar transparency. For now, the layer will sit on top of the poverty status layer you added previously. In the final app, you'll be able to view these two contextual layers one at a time, but for now you're just adding both to the map so you'll be able to pull data from them into the pop-ups you'll configure for each farmers market location.

  1. In the Layers pane, point to the Tract layer and click the Hide layer button to turn it off in the map.

    Layers pane with the Hide layer button shown for the Tract layer

  2. Click Add layer and search for ACS Race and Hispanic Origin in Living Atlas. Add the ACS Race and Hispanic Origin Variables – Boundaries layer owned by Esri.

    You can use the legend in the Properties pane and the pop-ups to see what the layer colors symbolize.

  3. In the Add layer pane, click the back button. In the Layers pane, expand the new group layer and change the name of the Tract layer to Tract (race).
  4. Remove the County and State layers (click the layer's Options button and choose Remove).
  5. Drag the group layer below the poverty status group layer.

    Reordering the layer means that the District Boundary (formerly State) layer masks this layer outside of the District of Columbia as well. You'll change the layer transparency of the layer to be similar.

  6. In the Properties pane, for Transparency, move the slider to 40%.

    Map showing race and poverty data

  7. Save the map.

Your map now contains five layers containing fresh food locations and contextual demographic information. All this data has been symbolized. In the next lesson, you'll create pop-ups for each farmers market location that shows all the contextual information in a readable format.

Customize pop-ups with Arcade

Now that you’ve styled your map, you will create an informative pop-up for the farmers markets. You'll use Arcade to incorporate information from other layers within the map into the layer's pop-ups. This information, including what percentage of the population is below the poverty level in the same tract as the farmers market and how many SNAP-accepting store locations are within walking distance from each market, will help the co-op decide which locations to target for accessibility programs.

Edit default pop-ups

All the layers already have pop-ups configured to share information about their default attributes. You'll make sure only the farmers market layer has pop-ups turned on. Then, you'll start configuring your own. Because the pop-ups are meant to convey information about each farmers market, you'll start by displaying important facts about each market.

  1. In the Layers pane, click the District Boundary layer to make it active.
  2. On the Settings (light) toolbar, click Pop-ups and turn off the Enable pop-ups option.

    Turn off the preconfigured pop-ups

  3. Turn off pop-ups for SNAP Store Locations and both Tract layers.

    The only layer that still has pop-ups enabled is the farmers market layer.

  4. In the Pop-ups pane, click the layer selection menu and choose USDA Farmers Market Directory as the active layer.

    The current pop-up is an unformatted list of all the attributes contained in the layer. You saw this list earlier in the table as well. First, you'll format the title of the pop-up.

  5. Expand Title.

    The current title is made up of two types of text. The first part of the title is static. It will appear the same in each pop-up. The second part of the title, encased in brackets, is an attribute field. Inserting an attribute field allows you to display feature-specific information in the pop-up.

  6. Delete National_Farmers_Market_Directory: from the beginning of the title text so that only the attribute remains.
  7. For Fields list, click Options and choose Delete.

    Delete option for the Fields list pop-up settings

    Now you can add custom elements to the pop-up. You'll use an Arcade script to format it the way you want.

  8. Above Title, click Attribute expressions. Click Add expression.

    An Arcade editor window appears. Like before, you'll write and test an expression in this window.


    The expression builder for pop-ups supports several functions that aren't supported in labeling and symbology. Because of this, expressions written for layer functionality other than pop-ups won't be available in the pop-up builder.

  9. In the Expression pane, paste and test the expression you used for symbology.
    var category
    if ($feature.WIC == "Y" && $feature.SNAP == "Y") {
    Category = "Both SNAP and WIC accepted"
    else if ($feature.WIC == "N" && $feature.SNAP == "Y") {
    Category =  "SNAP accepted but not WIC"
    else if ($feature.WIC == "Y" && $feature.SNAP == "N") {
    Category = "WIC accepted but not SNAP"
    else category = "Neither SNAP nor WIC accepted"
    return category
  10. Next to Custom, click Edit and type Public assistance category (pop-up text). Click Save.
  11. In the Arcade editor, click OK.

    The Arcade expression is added to the Attribute expressions pane

    The expression is added to the Attribute expressions pane and can now be added to the pop-up.

  12. In the Attribute expressions pane, click the back arrow.

    You'll add the expression to a text field and add more contextual information.

  13. In the Pop-ups pane, click Add content.
  14. In the Content menu, click Text.

    Add a Text component to the pop-up

    A blank text editor appears.

  15. Type the following text: This market is located at.

    Next, you'll add attribute fields to pull in the location of the market. Inserting an attribute field allows you to display feature-specific information in the pop-up. For example, when you click a market on the map, a city field displays the name of the city the market is located in.

  16. Press the spacebar and type {street.

    Add the Street attribute

    The list of attributes updates as you type.

  17. From the list, choose street {street}.
  18. Press Enter and add the attributes {city}, {State}, {zip} separated by commas.
  19. Press Enter again and type {expression. Choose Public assistance category (pop-up text) {expression/expr0}.

    Add the Arcade expression to your pop-up

  20. Highlight {expression/expr0}, click the Bold button, and click OK.

    The example pop-up shows the new configuration.

  21. Click any markets on the map to see others.

    Example formatted pop-up

  22. Save the map.

Add poverty status data to the pop-up

Now that your pop-up shows the relevant information about each market, you'll start adding some of the contextual information for decision-making. For each market, it would be helpful to understand how many people in the same census tract receive food assistance and might benefit from that market accepting SNAP and WIC. You'll write another Arcade expression using the Intersects function to create a location-based relationship between the farmers market and the poverty layer.

  1. In the Pop-ups pane, click Attribute expressions. Click Add expression.
  2. In the Arcade editor, rename the new expression Poverty rate in the tract where the market is located. Click Save.

    In this expression, you'll create a variable named pov to pull in poverty data from the ACS Poverty Status Variables layer.

  3. In the Expression box, type var pov = to create the new variable pov.

    This variable will represent the ACS Poverty Status Variables – Boundaries layer.

  4. On the Globals tab, expand the $map item by clicking the arrow.

    Expand the $map item to see other layers currently on the map

  5. For Layer: Tract, click FeatureSetById.

    Variable added to the expression for the Tract layer from ACS Poverty Status

    The layer is added to the variable. The rest of the function you write will pull data out of the specified layer.

  6. Press Enter to start a new line.
  7. On the second line, type return pov and click Test.

    The test result displays several rows of the Poverty Status layer's attribute table. The Type listed at the bottom is FeatureSet  Before, you may have noticed that most Type results were String because the previous expressions were returning text. A type of FeatureSet means that potentially more than one feature from this layer is a valid result.

  8. Click the beginning of line 2 and press Enter to move the return pov statement to the third line. On the blank second line, type var pov_tract = Intersects($feature, pov).
  9. On the third line, edit the return statement to return pov_tract and click Test.


    To see more information about any of the functions, you can search within the Functions tab, and click the information button. For a full list of Arcade functions, see the Arcade Function Index.

    The result shows a single record that a farmers market (represented by $feature) intersects with. The type here is still listed as FeatureSet because the Intersects function allows for multiple results. You know that these tracts are not overlapping, and that a farmers market can intersect with only one tract. You can ensure that you'll always get only one result by using the First function in combination with the Intersects function.

  10. On the second line, put parentheses around the Intersects($feature, pov) statement and add the First function before the opening parentheses.
    The updated line now reads:

    var pov_tract = First(Intersects($feature, pov))

    This will return the first tract that the farmers market intersects with, and then stop computing, which will save a split second of processing time. It also forces the type to be Feature instead of FeatureSet.

  11. Move the return statement to the fourth line. On the blank third line, type the following (include the period): var pov_rate = pov_tract.

    Using dot notation, you'll call the field (B17020_calc_pctPovE) from within the tract that was the result of line 2.

  12. On the Globals tab, click the arrow next to Layer: Tract. For Field: Percent of Population whose income in the past 12 months is below poverty level, click B17020_calc_pctPovE.

    The variable is added to the third line of the Expression pane, which now reads:

    var pov_rate = pov_tract.B17020_calc_pctPovE

  13. On the fourth line, change the return variable to return pov_rate and click Test.

    Test the pov_rate variable

    The final expression will look similar to the expression below, but using your layer ID.

    var pov = FeatureSetById($map, /* Tract */ "178ff59f6e2-layer-10")
    var pov_tract = First(Intersects($feature, pov))
    var pov_rate = pov_tract.B17020_calc_pctPovE
    return pov_rate

    If you paste this expression into your Arcade editor, make sure to change the FeatureSetByID value to match the layer on your map (through the Globals tab as you did earlier). This identifier is unique to the layer on your map.

  14. In the Arcade editor, click OK.
  15. In the Attribute expressions pane, click the back arrow. In the Pop-ups pane, add a new Text element.
  16. In the Text editor, type {expression and click Poverty rate in the tract where the market is located {expression/expr1}.
  17. After the expression, press the spacebar. Type or paste the text % of people in this tract had income below the Federal Poverty Level.
  18. Click OK.

    Pop-up including the configured percentage of people in the tract below the poverty level

    The pop-up now shows how many people below the poverty level live in each tract.

  19. Save the map.

Add race and ethnicity data to the pop-up

Next, you'll add race and ethnicity data for the tracts the farmers markets are in. Using similar logic as the Intersects expression above, you'll create eight expressions to show the racial breakdown of the population in each tract. You'll show this information in the pop-up as a bar chart.

The expressions will show the percentage of the population in the following groups based on the ACS data:

  • Hispanic and Latino
  • White alone, not Hispanic or Latino
  • Black or African American alone, not Hispanic or Latino
  • Asian alone, not Hispanic or Latino
  • American Indian and Alaska Native alone, not Hispanic or Latino
  • Native Hawaiian and Other Pacific Islander alone, not Hispanic or Latino
  • Some other race alone, not Hispanic or Latino
  • Two or more races, not Hispanic or Latino
  1. In the Pop-ups pane, click Attribute expressions and click Add expression.
  2. Title the new expression Percent Hispanic/Latino and click Save.

    Since this expression will be modeled from your previous expression, you'll add it to this expression and modify it instead of writing a new expression.

  3. Click the Existing tab.

    Existing functions tab

  4. Click Poverty rate in the tract where the market is located.

    The function is added to the Expression pane. Now you'll edit it to show the percentage of Hispanic population in the tract.

  5. Replace the first line with var race_layer =.
  6. Click the Globals tab. Click the arrow next to $map. For Layer: Tract (race), click FeatureSetById.
  7. On the second line, rename the variable race_tract and change the second argument of the Intersects statement to race_layer.
  8. On the third line, rename the variable race_rate. Set the variable equal to race_tract.
  9. Delete the existing field after the period. On the Globals tab, click the arrow next to Layer: Tract (race).
  10. For Field: Percent of Population that is Hispanic or Latino, click B03002_calc_pctHispLatE.

    The variable is added to the third line of the Expression pane, which now reads var race_rate = race_tract.B03002_calc_pctHispLatE

  11. On the fourth line, change the return variable to return race_rate and click Test.

    The expression should look similar to the expression below (with your layer ID).

    var race_layer = FeatureSetById($map, /* Tract (race) */ "17900992c4c-layer-14")
    var race_tract = First(Intersects($feature, race_layer))
    var race_rate = race_tract.B03002_calc_pctHispLatE
    return race_rate

    Expression showing the percentage of people of Hispanic origin in the same tract as the selected farmers market

  12. Click OK.

    The expression is added to the Attribute expressions pane.

  13. Add new expressions and modify the existing Percent Hispanic expression for the following groups:

    Use the Existing tab to modify a previously saved expression. Use the statement in line 3 to change the attribute field used from the Tract (race) layer.

    Expression titleField aliasField name

    Percent White alone

    White alone, Non-Hispanic


    Percent Black alone

    Black or African American alone, Non-Hispanic


    Percent Asian alone

    Asian alone, Non-Hispanic


    Percent American Indian/Alaska Native alone

    American Indian and Alaska Native alone, Non-Hispanic


    Percent Native Hawaiian/Other Pacific Islander alone

    Native Hawaiian and Other Pacific Islander alone, Non-Hispanic


    Percent other race alone

    Some Other Race alone, Non-Hispanic


    Percent two or more races

    2 or More Races, Non-Hispanic


    Now that you've brought the data into the farmers market layer, you'll use a chart to compare the racial and ethnic breakdown of the tracts.

  14. In the Attribute expressions pane, click back.
  15. Click Add content and choose Chart.

    Add a chart element to the pop-up

    The Configure chart window appears.

  16. Click Select fields.

    Select the fields to show in the bar chart

  17. In the Select fields window, choose all eight of the Percent expressions you created and click Done.
  18. In the Configure chart pane, click Done.

    Bar chart in the pop-up

    The bar chart is added to the example pop-up. Pointing to each bar shows the field it represents and the percentage. You'll add a title and information for your viewer to use it.

  19. In the Pop-ups pane, under Media, for Title type Racial and Ethnic Composition of this census tract. For Description, type Point to a bar for more information.

    Title and description in the Media group

    The title and description are updated in the pop-up as well.

Stores near markets

The final Arcade expression you'll create will list retail stores within a .75-mile radius that accept SNAP. The distance of .75 miles roughly represents walkability from the market. Like the previous expressions, you'll use the Intersects function, but this time you'll need to add it to a for loop. The for loop will make sure the expression repeats to count each store location.

  1. In the Pop-ups pane, click Attribute expressions and click Add expression.
  2. Title the new expression Count of SNAP retailers within a .75 mile radius and click Save.

    You'll create a variable called retail_layer on line 1.

  3. On the first line, type var retail_layer =.
  4. Click the Globals tab. Click the arrow next to $map. For SNAP Store Locations, click FeatureSetById.
  5. On line 2, create the radius variable that will be a .75 mile ring around each farmers market using the Buffer function.

    var radius = Buffer($feature,.75,"miles")

    In the same way you combined the First and Intersects function earlier, now you will combine the Count and Intersects function to get the count of SNAP retail locations that intersect your .75 mile buffer.

  6. On line 3, create the retail_count variable and set it equal to Count(Intersects(retail_layer, radius)).

    var retail_count = Count(Intersects(retail_layer, radius))

  7. Return the count and click Test. (Use your own layer ID if you copy the following code snippet.)
    var retail_layer = FeatureSetById($map, /* SNAP Store Locations */ "17c763185f8-layer-42")
    var radius = Buffer($feature,.75,"miles")
    var retail_count = Count(Intersects(retail_layer,radius))
    return retail_count

    Retail count expression

  8. Click OK to save the expression.
  9. Add another expression, title it List of SNAP retailers within a .75 mile radius, and click Save.
  10. Click the Existing tab and choose Count of SNAP retailers within a .75 mile radius.
  11. On line 3, change the variable name to nearby_stores and remove the Count function and the parenthesis around your new Intersects function.

    var nearby_stores = Intersects(retail_layer,radius)

  12. Remove the return statement on line 4.
  13. On line 5, create a variable called retail_list as a blank string variable by assigning it to be equal to empty single quotation marks.

    var retail_list = ''

    This will be the start of your list of stores.

  14. On line 6, create a for loop calling var k in the nearby_stores variable, type an opening curly bracket, and press Enter.

    for (var k in nearby_stores){


    This creates a counter variable that will iterate through all the records in nearby_stores. You may have noticed that when you typed the opening bracket, a corresponding closing bracket appeared on line 8. This prompts you to type into line 7 what will be done with each of these records in nearby_stores. You'll add the blank list using "retail_list += ", which means that information from each additional record will be added to the end of the list.

  15. On line 7, use dot notation to pull the Store_Name field from the SNAP Store Locations layer. Use the NewLine text formatting so that each store appears on a different line.
    for (var k in nearby_stores){
    retail_list += k.Store_Name + TextFormatting.NewLine
  16. Return the retail_list variable and test the function.
    var retail_layer = FeatureSetById($map, /* SNAP Store Locations */ "178f065ba89-layer-82")
    var radius = Buffer($feature,.75,"miles")
    var nearby_stores = Intersects(retail_layer,radius)
    var retail_list = ''
    for (var k in nearby_stores){
    retail_list += k.Store_Name + TextFormatting.NewLine
    return retail_list

    Function returning a list of the stores within a .75 mile radius of each market

  17. Click OK.
  18. In the Attribute expressions pane, click the back arrow. Add a new Text element.
  19. Add the two new count and list expressions by typing or pasting the following, using your expression identifiers if different:

    There are {expression/expr10} stores that accept SNAP within 0.75 miles of this market. They are:


  20. Click OK.

    The pop-ups now include the count and names of stores close to each market. The pop-ups contain all the information that will help the co-op make decisions. Before you save the map, you'll turn off the two contextual layers so that viewers will be able to control them from the final app.

  21. In the Layers pane, turn off both tract layers.
  22. Save the map.
  23. On the Contents toolbar, click Share map. In the Share window, choose Everyone (public) and click Save.

Configure the web app to share

You're finally ready to build the app. The most important data for people to see on the app is the farmers markets and pop-ups. You also want to be able to see the contextual layers you've added. The app template you'll choose will allow you to show these features.

  1. On the Contents toolbar, click Create app and choose Instant Apps.

    A new tab opens with the different ArcGIS Instant Apps templates. Each app template is meant to create a focused experience. These templates allow you to place a map into a template that creates a polished, interactive experience for your map's audience.

    You are interested in showcasing your map alongside a legend, the pop-up, and some basic information in a side panel.

  2. On the Instant Apps home page, search for panel to filter the gallery. On the Sidebar card, click Choose.

    The Create app window appears.

  3. For the title, type Inclusive Farmers Markets – Viewing App and click Create app.

    This is the title that will appear in your ArcGIS content. The default app configuration opens to express setup, which steps you through the fewest essential options. To access all the configuration settings, you can turn off Express.

  4. In the Express pane, click the step for the About settings.
  5. Verify that Header is turned on and change App title to Current Status.

    The top of the app preview changes to reflect the new title. Next, you'll choose which information panels to show in the sidebar.

  6. Click Next.

    The app already includes panels for the legend, pop-ups, and map details. You'll also include the Layer list panel so users can show and hide layers based on the data they're interested in. For example, they can view the two Tract layers separately.

  7. Turn on Layer list.

    You can select specific layers to include in the layer list panel. If you don't select any, it shows all the layers. You'll accept this default.

  8. Click Next.
  9. In the Interactivity settings, turn off Search.
  10. Click Next.

    In the Theme & Layout settings, you can change the color scheme and choose where to position tools on the app screen. Currently, map tools are aligned next to each other on one side of the app. This works for your app, so you won't change those. But you'll change the theme because the dark symbols in your legend aren't legible in the dark theme.

  11. For Select a mode, choose Light.

    As you change the configuration, the app is automatically saved with updates.

  12. Click Publish and click Confirm.

    A success message confirms that your app has been published. Before sharing the app, you need to add the information that populates the Details panel, which automatically uses the text from the map's description. You'll edit the item details for the map.

  13. Close the Share window.
  14. In the Express pane, click the step for the Map settings.
  15. Click View item details.

    The map's item page opens in a new tab. Anything that you add to the Description section will display in the app's Details panel, so you'll add information about navigating the app.

  16. For Description, click Edit, type or paste the following, and click Save.

    This app shows the location of farmers markets and other stores in the Washington, D.C. area where food assistance is accepted.

    Click the diamonds on the map to see information about each farmers market, including the types of food assistance it accepts and the demographics of the area it serves. For more reference, turn on the Legend and Layers panels to view contextual data on the map.

    Now that this description will appear in your app, you're ready to share it for analysis.

  17. Close the item page and return to the configuration window for your app.
  18. In the configuration panel, click Share.
  19. In the Share window, click Change share settings. Choose Everyone (public) and click Save.
  20. Click Exit and confirm that you want to exit, when prompted.

    In the app's item page that opens, you can provide additional item details, such as a summary, description, and terms of use.

  21. Click View to open your app.
  22. In the app, click the Details button to see the new description in the side panel

    Final app with the farmers markets map and Details panel

  23. Test the app by clicking farmers market symbols to show the pop-up information in the side panel and by turning the tract layers on and off to explore the map.

You are now ready to present this app at a farmers market co-op meeting. Using the app, consider making a few recommendations.

If there were two or three farmers markets you could recommend to start accepting SNAP and WIC benefits that currently do not, which two or three would you recommend? Do you think it would be worth highlighting that the Stanton & Turner Open Air Farmers Market (around Douglass Dwellings) is a farmers market in an area with a higher percentage of Black or African American residents and higher percentage of people living below the poverty level that does not currently accept WIC or SNAP? Providing an example recommendation can more clearly demonstrate how one can use the information in the app to make an informed decision or recommendation.

There's no one right answer, but answers should take into consideration poverty rate, racial and ethnic composition, the count and type of stores (full-service grocery stores such as Safeway and Giant as opposed to convenience stores such as 7-Eleven and drug stores such as CVS), the quality of nearby SNAP retailers, and possibly the farmers markets' hours of operation.