Style layers in a web map

Learn how to use Map Viewer to style layers in a web map.

You can change the basemap and style data layers from a web map using the Map Viewer. You style data layers by defining symbols and applying them with a renderer. Layers can be styled with a single symbol for all locations, or with multiple symbols based on attribute or numeric values. You can also configure pop-ups and labels. Once the layers in a web map are styled, you can load it into an application using the web map's item ID.

In this tutorial, you change the basemap and style feature layers created from the Los Angeles GeoHub dataset.

Prerequisites

You need an ArcGIS Developer or ArcGIS Online to create and manage web maps and web scenes.

Steps

Copy the web map

Use the unstyled LA Parks and Trails Map as a starting point for the tutorial. Or, if you prefer, use your own web map from the Create a web map tutorial.

  1. Go to the LA Parks and Trails Map (unstyled) web map.

  2. Click Sign In > Save > Save As to copy the map. At minimum, you need a title and tags to save the web map.

Update the basemap

It is generally best practice to start with the basemap when styling a web map. Basemaps set the context for the other layers that will be drawn over it. To improve the quality of the basemap, use the World Hillshade map tile layer as the basemap, and add the World Topographic Map vector tile layer over it.

  1. In the left-panel, click the Basemap icon.

    • Scroll down and in the Living Atlas search box, type: Outdoor.
    • Click OUtdoor Map (by Esri Vector Maps) > Use as basemap (at the bottom) > Done.
  2. In the left-panel, click Basemap to close the window.

Style trailheads (points)

You can style point features by setting a symbol, such as simple shapes or icons, in a simple renderer. All features in the view will display the same symbol. In this instance, all trailheads will display a hiker icon.

  1. In the left panel, click Layers > Trailheads to open the layer's properties.

  2. In the right panel, click Styles > Location (Single symbol) > Symbol style to open a symbol panel.

  3. In the dropdown menu, select Points of Interest.

  4. Scroll down and select the hiker icon with a black background and white foreground. Adjust the icon size to 18 pixels.

  5. Click Done > Done.

Style trailheads with labels

Use labels to display trailhead names.

  1. In the Properties panel, click Labels > +Add label class . Verify that Enable labels is switched on.

  2. Select the TRL_NAME attribute in size 13pixels > Edit label style

  3. Close the panel.

Style trails (lines)

You can classify features by numeric field values to show differences in the data. You style line features using a symbol and a simple renderer.

  1. Go back to the Layers panel on the left.

  2. Click Trails.

  3. On the right, in the Properties panel, click Edit layer style.

  4. In Pick a style > Location (single symbol).

  5. In Symbol style, set the following:

    • Color: Black
    • Transparency: 0
    • Width: 1.15
  6. Set the Pattern to a dotted line.

  7. Click Done > Done

Style bike-only trails

Use the Filter tool to style bike-only trails.

  1. In the right panel, click Add data > Web service.

  2. Enter the Trails-Trails_0 layer URL: https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0 > Add to map.

  3. Click Layers.

  4. Rename Trails 0 to: Bike Only Trails.

  5. Click on the layer to open the Properties panel.

  6. Click Filter > +Add Expression to set the fields: USE_BIKE is YES > Save.

  7. On the right, in the Properties panel, click Edit layer style.

  8. In Pick a style > Location (single symbol).

  9. Click Symbol style and set the following properties:

    • Select color: `#efefef (white/gray)
    • Stroke:
      • Pattern : a solid line
      • Width: 2
  10. Click Done > Done.

Style park areas (polygons)

You can apply different styles to features by classifying them by unique field values. You style polygons with a simple fill symbol and adding it to a simple renderer. Use the TYPE field in the Parks and Open Space layer to classify the data and apply a different color symbol to each land type.

  1. Double click the Parks and Open Space layer to open the Properties panel.

  2. Click Styles.

  3. In Choose attributes > +Fields.

  4. Select TYPE > Add.

  5. In Try a drawing style > Types(unique symbols).

  6. Click Symbol style to select a color ramp. Set the fill transparency to 0.

  7. Click Done > Done.

  8. In the left-panel, click Save to save your map.

Explore the web map

  1. In the left panel, click Legend to see the styled layers. Your web map should look something like this.

  2. Click on features in the map to display attribute data.

You can load the styled web map with its item ID. When the web map is loaded, all of the data and basemap layer settings will be applied.

What's Next

Learn how to use additional tools, APIs, and location services in these tutorials:

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.