Skip To Content ArcGIS for Developers Sign In Dashboard

Symbolize data

In ArcGIS Runtime, for many types of geographic data, you can control how your data are displayed. Feature layers, raster layers, graphic overlays, and even vector basemaps provide the ability to alter display characteristics like size, color, rotation and so on.

The rendering of geographic data is generally controlled by one or more of the following types of classes:

  • Symbol—Defines a set of display properties, such as color and size, for features and graphics (collectively referred to as geoelements).
  • Renderer—A collection of one or more symbols and logic to determine which symbol to apply to each geoelement, usually based on one or several attribute values.
  • Raster renderer—Used exclusively for raster data, these renderers determine which color to apply for each raster cell value.
  • Style—A predefined definition, available for some layer formats, of how a layer should be displayed. If more than one style is available, it can be changed dynamically.

The Symbols, renderers, and styles topic provides an overview of these classes. This topic describes how to customize the display of various types of data you might include in your app, and shows examples.

The following table describes options for symbolizing different types of data.

Data typeSymbology options



  • Apply a renderer to the feature layer or feature collection
  • Assign 3D properties (such as an extrusion expression) to the renderer for display in a scene view


Vector basemap

WMS layer

Work with symbols

ArcGIS Runtime SDK provides a variety of symbols for displaying geoelements in a map or scene. These symbols fall into one of two broad categories: simple or multilayer. You can create these symbols new, read them from a file, and make edits to their properties. See Symbol types described for an overview and a discussion of the available types of symbols.

Create simple symbols

Simple symbols follow the web map specification and you can create and work with them through the simple symbol classes in the API (SimpleMarkerSymbol, SimpleLineSymbol, and SimpleFillSymbol). These are also the symbols you get from web maps or from feature services when advanced symbology is turned off. Each of the simple symbol types provides an enumeration of pre-defined styles that can be applied to the symbol.

The following example creates a simple marker symbol and a text symbol to display on the map.

// create a red circle marker symbol
var markerSym = new SimpleMarkerSymbol
    Style = SimpleMarkerSymbolStyle.Circle,
    Color = Color.Red,
    Size = 12

// create a text symbol
var textSym = new TextSymbol
    Angle = -55,
    Color = Color.Red,
    Size = 18,
    Text = "You are here",
    HorizontalAlignment = Esri.ArcGISRuntime.Symbology.HorizontalAlignment.Left,
    VerticalAlignment = Esri.ArcGISRuntime.Symbology.VerticalAlignment.Bottom

// create a graphic that uses the marker symbol
var pointGraphic = new Graphic(point, markerSym);

// create a graphic that uses the text symbol
var textGraphic = new Graphic(point, textSym);

// add the graphics to a graphics overlay in the map view
var graphics = MyMapView.GraphicsOverlays[0].Graphics;

Text symbol with angle defined

There are various ways to create picture marker symbols, as the following examples illustrate.

You can create a picture marker symbol from a URL:

// create a new PictureMarkerSymbol with an image file stored online (.png, .jpg, .bmp)
var picUrl = @"";
PictureMarkerSymbol picMarkerSym = new PictureMarkerSymbol(new Uri(picUrl));

// apply the symbol to a new graphic and add it to a graphics overlay in the map view
var graphic = new Graphic(location, picMarkerSym);

You can create a picture marker symbol from an Android Drawable:

var drawable = (BitmapDrawable)Resources.GetDrawable(Resource.Drawable.red_pin_marker);
var pictureMarker = await PictureMarkerSymbol.CreateAsync(drawable.Bitmap);
var location = new MapPoint(-117.0, 40.5, SpatialReferences.Wgs84);
var graphic = new Graphic(location, pictureMarker);

You can create a picture marker symbol from a resource in the project:

// create a new PictureMarkerSymbol with an image resource in the project
var picUrl = 
// pass the URI to the image to the symbol constructor
var pictureMarkerSym = await PictureMarkerSymbol.CreateAsync(new Uri(picUrl, UriKind.RelativeOrAbsolute));

// apply the symbol to a new graphic and add it to a graphics overlay in the map view
var graphic = new Graphic(location, pictureMarkerSym);

You can create a picture marker symbol from a raw Json string:

// create a new PictureMarkerSymbol from a Json string
var picJson = "{\"type\":\"esriPMS\"," + 
    "81O20AQx/dL6ZYcQpCsRBhQVLxxiWxz4IDKoRwIL8CJcw48RpA4BUGUiAOQhEbm0IAQkht4qxzKG/DvoWLJAhHFBCykjrQHyzM" +
    "7v50Ze2cI+ciyubmJjY0NXF9d492dl9fK4JyDUYaVbyuxAURcw8FgQG5vbwkhhPy+uYm7DWFxDUEw/JAAAO69UpoAwLhkTBGIH" +
    "4KPGwFTEojA/yI0IpBECgxJPAVJALxpCg4ODl74d38eYG9v7/k9Ly4u4DgOOOewLAutVmukkeu6oJSCUgrfD0bq1et1TE5OgnM" +
    "O13VxeXk5GmR3dxdSSr2xZVkIw/BJg2GAwF98UqfZbCKTyWi9dDqNRqMxGiCKIvi+DyGENioUCmi324+MDIDgMUCtVkMulwNjD" +
    "JRSCCGwtLT0fBqOjo7huq6G4JxDKYXDw0PDuFgsaoDFBwA7OzuwbdtwHgQBTk9P/6222sdtzH+ZB2MMjDGdv2EIA2DxHmB7exszM" +
    "zPaOeccnueh1zt7WWF3u11MT0+DMQZCCIQQUErpwlRKPQKoVqvI5/PahjEGpRSiKIrXM/V+9jDxeUKfhjGGubk5bG1tYXZ21qiT" +
    "SqWCbDZr6OZz+dd3y+dn57BtG5xz7VAIoR3dOXv4vlQqja9VD8MQjuPowiSEaGcPVyr1CcvLy+OfE36cdLHwdcH4RIcXIQRSSq" +
    "x+X327IeWkcwLP84xw3y0pJcpr5befkDqdDkqlkgEhpcT6+vr7jWdhN4Qz//fOSKVSrzp57Hu0/6uP/lWfTE1Nkf39/Vd0BAnLH" +
    "3KRNn8UVI54AAAAAElFTkSuQmCC\"," +
    "\"contentType\":\"image/png\"," +
    "\"width\":0,\"height\":0,\"angle\":0," +
    "\"xoffset\":0,\"yoffset\":0," + 
// pass the URI to the image to the symbol constructor
var pictureMarkerSym = Symbol.FromJson(picJson);

// apply the symbol to a new graphic and add it to a graphics overlay in the map view
var graphic = new Graphic(location, pictureMarkerSym);

Traffic signals displayed with a picture marker symbol.

Create multilayer (advanced) symbols

Multilayer symbols are based on a subset of the ArcGIS Pro symbology model. These symbols are composed of one or more symbol layers and can contain different symbol types within each layer with definable behaviors to get advanced cartographic effects. You can modify properties of individual symbol layers, or use properties of the symbol itself to apply a value (color or size, for example) to all the symbol layers it contains.

There are multilayer symbol classes for displaying points (MultilayerPointSymbol), polylines (MultilayerPolylineSymbol), and polygons (MultilayerPolygonSymbol). A multilayer symbol can contain one or several symbol layers of the same or different type. A symbol used to render polygons, for example, might contain a fill symbol layer to render the polygon interior, a stroke symbol layer for rendering the polygon outline, and a marker symbol layer to render polygon vertices. For a description of the types of symbol layers available for a multilayer symbol, see the symbol layers section of the symbol types described topic.

The following example creates a new multilayer polygon symbol with fill and stroke symbol layers and applies it to a polygon graphic.

// Create a blue solid fill symbol layer for the polygon interior.
FillSymbolLayer fillSymLayer = new SolidFillSymbolLayer(Color.Blue);

// Create a dark gray solid stroke symbol layer for the polygon outline.
StrokeSymbolLayer strokeSymLayer = new SolidStrokeSymbolLayer(8.0, Color.DarkGray);

// Add the symbol layers to a list and use it to create a multilayer polygon symbol.
List<SymbolLayer> symbolLayers = new List<SymbolLayer> { strokeSymLayer, fillSymLayer };
MultilayerPolygonSymbol multilayerPolySym = new MultilayerPolygonSymbol(symbolLayers);

// Apply the multilayer symbol to a polygon graphic.
Graphic parcelGraphic = new Graphic(parcelPolygon, multilayerPolySym);

Some symbol layers can contain additional symbol layers. A hatch fill symbol layer, for example, is composed of multilayer polyline symbols that define the hatch lines.


The order in which symbol layers are added dictates their drawing order in the symbol. The last layer in the collection will be the last layer to draw.

The following example uses a hatch fill symbol that contains a multilayer polyline symbol.

// Create two solid stroke layers to define the hatch: a wide blue line and a narrow white line.
SolidStrokeSymbolLayer wideHatchSymbolLayer = new SolidStrokeSymbolLayer(8, Color.DarkSlateBlue);
SolidStrokeSymbolLayer narrowHatchSymbolLayer = new SolidStrokeSymbolLayer(2, Color.WhiteSmoke);

// Create a multilayer polyline symbol from the stroke symbol layers.
List<SymbolLayer> hatchLineSymLayers = new List<SymbolLayer> { wideHatchSymbolLayer, narrowHatchSymbolLayer };
MultilayerPolylineSymbol hatchLineSymbol = new MultilayerPolylineSymbol(hatchLineSymLayers);

// Create a hatch fill symbol layer that uses the polyline symbol to render hatches in the polygon interior.
HatchFillSymbolLayer fillSymLayer = new HatchFillSymbolLayer(hatchLineSymbol, 45.0)
    // Set the hatch line separation (DIPs.
    Separation = 15

// Create a dark gray solid stroke symbol layer for the polygon outline.
StrokeSymbolLayer outlineSymLayer = new SolidStrokeSymbolLayer(8.0, Color.DarkGray);

// Add the symbol layers to a list and use it to create a multilayer polygon symbol.
List<SymbolLayer> symbolLayers = new List<SymbolLayer> { fillSymLayer, outlineSymLayer };
MultilayerPolygonSymbol multilayerPolySym = new MultilayerPolygonSymbol(symbolLayers);

Multilayer hatch fill symbol.

Read symbols from a style file

For complex multilayer symbols, especially those you use frequently, it's easier to read them from a mobile style file (.stylx) than to create them from scratch. ArcGIS Pro provides an intuitive authoring environment for creating multilayer symbols. These symbols can be saved in a mobile style file (.stylx) and then consumed in your ArcGIS Runtime app.


Standard ArcGIS Pro style files and mobile styles both have a .stylx extension, but only mobile styles are supported in ArcGIS Runtime. Symbols from a standard style can be copied to a mobile style file, but may be generalized if they contain unsupported features, such as true curves or color gradients.

A mobile style can be opened in your app using the static OpenAsync method of Esri.ArcGISRuntime.Symbology.SymbolStyle. Each symbol in the mobile style has a unique key, name, tags, and category. You can reference a symbol using its key or search the style to return a set of results.

The following example opens a mobile style file and uses the default search parameters to return all symbols in the style.

// Open a mobile style file.
SymbolStyle emojiStyle = await SymbolStyle.OpenAsync(_mobileStylesLocation + "emoji-mobile.stylx");

// Get the default style search parameters.
SymbolStyleSearchParameters searchParams = await emojiStyle.GetDefaultSearchParametersAsync();

// Search the style with the default parameters to return all symbol results.
IList<SymbolStyleSearchResult> styleResults = await emojiStyle.SearchSymbolsAsync(searchParams);

// Loop through the results (perhaps look for symbols from a certain category).
foreach (SymbolStyleSearchResult result in styleResults)
   if(result.Category == "Hat")

You can use a symbol's key to return it from the style. You can also get several symbols from a style as a single combined symbol. The GetSymbolAsync method of a SymbolStyle instance takes a list of identifiers (one or more keys) and returns a symbol that is a combination of all symbols that were found.

The following example uses a list of keys to create a symbol that contains four symbols from the mobile style.

// Open a mobile style file.
SymbolStyle emojiStyle = await SymbolStyle.OpenAsync(_mobileStylesLocation + "emoji-mobile.stylx");

// Define the key for each symbol to combine.
List<string> keysList = new List<string>

// Get a symbol from the style that combines the identified symbols (in order).
Symbol faceSymbol = await emojiStyle.GetSymbolAsync(keysList);

A combined symbol constructed from individual style items.

Convert simple symbols to multilayer

The trade-off between simple and multilayer symbology is convenience versus control. Simple symbols are easy to create but offer a finite set of style options. Multilayer symbols often require a lot of code to create from scratch but give you fine-grained control and allow you to create more complex symbols. You might have simple symbols in your app that you'd like to convert to multilayer symbols, perhaps as a starting point for creating more complex types of symbols.

Simple marker, line, and fill symbols provide a ToMultilayerSymbol helper to convert to an equivalent multilayer symbol.

  • Simple marker symbol is converted to a multilayer point symbol. A vector marker symbol element layer is added to the symbol layer collection to represent the original marker symbol (circle, square, triangle and so on). The vector marker symbol element layer geometry is a polygon.
  • Simple line symbol is converted to a multilayer polyline symbol. A stroke symbol layer is added to the symbol layer collection to represent the original line symbol. If necessary, an effect is applied to the stroke layer to represent dash styles.
  • Simple fill symbol is converted to a multilayer polygon symbol. A hatch or solid fill symbol layer is added to the symbol layer collection depending on the fill pattern (solid, horizontal, vertical and so on).

Once a simple symbol is represented as multilayer, you can add additional layers (perhaps from other simple symbols that you converted).

The following example converts a simple marker symbol and adds another symbol layer to draw hatch lines on the marker.

// Create a simple marker symbol (red circle).
SimpleMarkerSymbol simpleCircleMarker = new SimpleMarkerSymbol(SimpleMarkerSymbolStyle.Circle, Color.Red, 20);
// Convert the simple marker to a multilayer point symbol.
MultilayerPointSymbol multilayerPointSymbol = simpleCircleMarker.ToMultilayerSymbol();

// Get the first (only) symbol layer from the new multilayer point symbol.
VectorMarkerSymbolLayer vectorMarkerSymLayer = multilayerPointSymbol.SymbolLayers.FirstOrDefault() as VectorMarkerSymbolLayer;

// Get the first (only) element in the vector marker symbol layer (it's a circle polygon element).
VectorMarkerSymbolElement circleVectorMarkerSymElement = vectorMarkerSymLayer.VectorMarkerSymbolElements.FirstOrDefault();

// Create a stroke symbol layer for hatch lines (white solid stroke).
SolidStrokeSymbolLayer hatchStrokeLayer = new SolidStrokeSymbolLayer(1, Color.White);

// Use the stroke layer to create a new multilayer polyline symbol for the hatch lines.
MultilayerPolylineSymbol multilayerPolylineSym = new MultilayerPolylineSymbol(new List<SymbolLayer> { hatchStrokeLayer });

// Create a new hatch fill symbol layer with the polyline symbol. Specify a line separation of 8 DIPs.
HatchFillSymbolLayer hatchFillLayer = new HatchFillSymbolLayer(multilayerPolylineSym, 45)
    Separation = 8

// Create a new multilayer polygon symbol with the hatch fill layer.
MultilayerPolygonSymbol multilayerPolygonSym = new MultilayerPolygonSymbol(new List<SymbolLayer> { hatchFillLayer });

// Get the geometry from the vector marker symbol element (polygon).
Geometry vectorElementGeometry = circleVectorMarkerSymElement.Geometry;

// Create a new vector marker symbol element to display the hatch fill, use the same marker shape (circle polygon) for the geometry.
VectorMarkerSymbolElement hatchVectorMarkerSymElement = new VectorMarkerSymbolElement(vectorElementGeometry, multilayerPolygonSym);

// Update the multilayer point symbol by adding the new hatch element to the vector marker symbol layer.

// Apply the symbol to a point graphic.
Graphic pointGraphic = new Graphic(tapPoint, multilayerPointSymbol);

Map view showing red multilayer point symbols with white hatch lines.

Create 3D symbols

While you can use the same 2D symbols available for symbolizing graphics in a map view, ArcGIS Runtime provides some specialized symbols for displaying graphics in a scene view. You can display points and lines as 3D shapes or use models to realistically represent real-world objects (such as vehicles). See 3D-specific symbols for more information.

Add shape-based symbols

3D shapes, such as a cone, floating on the earth's surface.

The following code snippet shows how to create a sphere symbol and render it using a point geometry in a graphic.

// create a red sphere symbol
var sphereSymbol = new SimpleMarkerSceneSymbol
    Style = SimpleMarkerSceneSymbolStyle.Sphere,
    Color = Color.Red,
    Height = 3000,
    Width = 3000,
    Depth = 3000,
    AnchorPosition = SceneSymbolAnchorPosition.Center

// create a graphic using a map location (point) and the sphere symbol
var location = new MapPoint(-4.04, 53.16, 1000, SpatialReferences.Wgs84);
var sphereGraphic = new Graphic(location, sphereSymbol);

// add the graphic to the first graphics overlay in the scene view

Add model symbols

Model symbol representing a helicopter.

Create these model symbols using the ModelSceneSymbol class.

// call the static CreateAsync method to create a new ModelMarkerSymbol, pass a uri for the model and a scale
var modelSymbol = await ModelSceneSymbol.CreateAsync(modelSourceUri, 300.0);

// create a graphic using a map location (point) and the model symbol
var location = new MapPoint(-4.04, 53.16, 2000, SpatialReferences.Wgs84);
var modelGraphic = new Graphic(location, modelSymbol);

// add the graphic to the first graphics overlay in the scene view

Distance composite symbols

While model symbols closely resemble the real-world object they represent when viewed close up, when you zoom away from them, the symbols gets smaller until they're no longer visible. If you want to see the location of your graphics at any distance from the camera, use distance composite symbols. These symbols allow you to use different symbols depending on the distance the graphic is from the camera.

The code snippet below the following images shows how to set up a distance composite symbol similar to the one shown in the images.

When the camera is far away from the point, a red simple marker symbol displays.

Graphic showing how a simple point is displayed when the camera is far away.

As you zoom closer to the point, the symbol renders as a cone pointing in the aircraft's direction of travel.

Graphic showing a cone symbol indicating heading at intermediate camera distance.

When viewed even closer, the point displays as a model symbol, which is appropriate at this distance from the camera.

Example of how a model symbol displays at the nearest camera distance.

// create a new DistanceCompositeSceneSymbol to hold a collection of range-specific symbols
var compositeSymbol = new DistanceCompositeSceneSymbol();

// ... code here to create new ModelMarkerSymbol, ConeMarkerSymbol, and SimpleMarkerSymbol ...

// use a model symbol when the camera is within 5,000 meters
var nearSymbolInfo = new DistanceSymbolRange(modelSymbol, 0, 5000);

// use a cone marker symbol for intermediate distances (5,000 to 50,000 meters)
var midSymbolInfo = new DistanceSymbolRange(coneSymbol, 5000, 50000);

// use a simple marker symbol for large distances (> 50,000 meters)
var farSymbolInfo = new DistanceSymbolRange(markerSymbol, 50000, 0);

// create a new graphic using the DistanceCompositeSceneSymbol
var location = new MapPoint(-4.04, 53.16, 2000, SpatialReferences.Wgs84);
var distanceCompositeGraphic = new Graphic(location, compositeSymbol);

// add the graphic to the first graphics overlay in the scene view

Apply a renderer

A renderer is an object that determines how geoelements (features or graphics) are displayed. A renderer includes one or more symbols as well as logic to determine which symbol to apply for data in the layer (or graphics overlay). There are a variety of renderer types, each designed to use a different rendering logic. Renderers use attribute values to determine which symbol should be applied.

The Symbols, renderers, and styles topic provides an overview of symbols and renderers and how they work together to symbolize data.


If you apply a symbol to a graphic that is in a graphics overlay with a renderer, the symbol on the graphic will take precedence over the renderer.

Much of the data you bring into your ArcGIS Runtime app includes default rendering information. Layers from a web map, service, or mobile map package, for example, are displayed using the symbols applied when they were authored. You can make changes to an existing renderer for a layer, or create and apply new renderers. Be aware that some rendering behavior, while honored by your app, cannot be modified using ArcGIS Runtime SDK. Unique value renderers and class breaks renderers, for example, can be authored using ArcGIS Pro to define scale ranges for applying associated symbols. These scale ranges will be used when displaying the layer in an ArcGIS Runtime app but no API is exposed for creating or modifying ranges. See Scale-based symbol classes in the ArcGIS Pro documentation for more information about using scale ranges for these renderers.

ArcGIS Runtime SDK provides simple, unique value, class breaks, and dictionary renderers for displaying geoelements.

The following steps describe the process for defining a renderer for a feature layer or graphics overlay. Dictionary renderers are described in the Display military symbols with a dictionary renderer topic. See the Raster renderers section for examples of changing raster display.

  1. Create a new renderer of the desired type: simple, unique value, or class breaks.
  2. Create the symbol(s) required by the renderer and appropriate for the geometry type. The Symbol types described topic provides an overview of the available ArcGIS Runtime symbols.
  3. Define the logic that the renderer needs in order to apply the correct symbol for each geoelement. Depending on the type of renderer, this could be one or several attribute names or ranges of values for a given numeric attribute. A simple renderer always applies a single symbol to all geoelements.
  4. For unique value or class breaks renderers, associate the desired symbol for each range or unique value defined in the renderer.
  5. Apply the renderer by assigning it to the to the feature layer or graphics overlay.

Simple renderer

A simple renderer uses one symbol for all features in a layer (or all graphics in an overlay) regardless of attribute values.

Unique value renderer

A unique value renderer symbolizes features in a layer (or graphics in an overlay) differently based one or more of their attribute values. It's useful for symbolizing features based on an attribute whose values represent names or categories, usually referred to as nominal data. Unlike graphics, features do not have a symbol property and therefore cannot be assigned an individual symbol. However, you can use a unique value renderer to set symbology on a layer based on each feature's attribute values. (You can do this for graphics, too).


ArcGIS map services allow up to three fields to be used for unique value renderers. An ArcGIS feature service allows only one. As a developer, you can specify as many fields as you like, ensuring that the order of the fields you specify corresponds to the order of the values you specify.

The example below creates a unique value renderer that displays US states with different symbols according to the value of their state abbreviation attribute. Since only California, Nevada, and Arizona have been defined explicitly in the renderer's UniqueValueInfoCollection, features with any other value for the state abbreviation attribute ( STATE_ABBR) display with the default (transparent) symbol.

Unique value renderer applied to some US states.

Features whose attribute value falls outside the classes defined for the renderer are symbolized with the default symbol. If a default symbol is not defined, those features won't display.

Class breaks renderer

Use a class breaks renderer to symbolize quantitative information about feature data. Class breaks symbology divides the range of feature values into a relatively small number of classes. For example, you can use a class breaks renderer to symbolize geoelements by population value, dividing the features into three classes of low, medium, and high population value.

One symbol is associated with each class, and is used to render geoelements whose attribute value falls within the range defining the class. For example, with polygons, you could use a yellow fill symbol to represent low population, an orange fill for medium population, and red fill for high population. If a geoelement has an attribute value that falls outside all class ranges, a default symbol can be applied (or no symbol).

Symbol color is an effective way to represent differences in magnitude of a phenomenon because it is easy to distinguish variations in color if there are relatively few classes. A range of seven colors is the approximate upper limit of colors that can be easily distinguished on a map. Avoid using too many classes, especially if you are using light colors.

A class breaks renderer can be used for any geometry type and the symbols do not have to only vary by color. For example, a line feature class representing roads with associated numeric values for traffic density can be rendered using different line widths for high, medium, and low traffic. City points can be classified with a range of circular marker symbols with different sizes or colors (or both) based on population.

// Create a new service feature table using the USA States url.
ServiceFeatureTable statesFeatureTable = new ServiceFeatureTable(new Uri(""));

// Create a new feature layer using the service feature table.
FeatureLayer statesLayer = new FeatureLayer(statesFeatureTable);

// Create a new class breaks renderer.
ClassBreaksRenderer statePopRenderer = new ClassBreaksRenderer
    // Define "POP2007" as the field containing the values for the class breaks renderer.
    FieldName = "POP2007"

// Create an outline symbol to use for each polygon.
SimpleLineSymbol outlineSymbol = new SimpleLineSymbol(SimpleLineSymbolStyle.Solid, Color.LightGray, 1);

// Define the symbols to use for each population range.
SimpleFillSymbol popSymbol1 = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.FromArgb(150, Color.Yellow), outlineSymbol);
SimpleFillSymbol popSymbol2 = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.FromArgb(150, Color.Orange), outlineSymbol);
SimpleFillSymbol popSymbol3 = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.FromArgb(150, Color.Red), outlineSymbol);

// Define the ranges of values to render with (class breaks).
ClassBreak popBreak1 = new ClassBreak("Low", "0 - 1M", 0, 999999, popSymbol1);
ClassBreak popBreak2 = new ClassBreak("Medium", "1M - 10M", 1000000, 9999999, popSymbol2);
ClassBreak popBreak3 = new ClassBreak("High", "10M - 40M", 10000000, 40000000, popSymbol3);

// Add the class breaks to the renderer.

// Set the default fill symbol (transparent with no outline) for any population values not within a range defined in the renderer.
SimpleFillSymbol defaultFillSymbol = new SimpleFillSymbol(SimpleFillSymbolStyle.Null, Color.Transparent, null);
statePopRenderer.DefaultSymbol = defaultFillSymbol;
statePopRenderer.DefaultLabel = "Other";

// Apply the class breaks renderer to the states layer.
statesLayer.Renderer = statePopRenderer;

// Add the new layer to the map.

The following image shows a class breaks renderer with three class breaks. The US States layer is classified by three ranges of population for the year 2007.

A class breaks renderer applied to a US States layer to show classes of population.

3D renderer properties

When using renderers in 3D, you can set properties to define extrusion expressions for both features and graphics. For graphics you can also define a rotation expression to control heading, pitch, and roll.

Extrusion is the process of stretching a flat 2D shape vertically to create a 3D object. This provides a simple method to create three-dimensional symbology from two-dimensional features. For example, you can extrude building polygons by a height value to create realistic building shapes. You can also use extrusion to illustrate relative values in your data. The three basic geometry types-points, lines, and polygons-all support extrusion.


Extrusion may not work with some types of multilayer symbols, such as hatch fills.

To apply extrusion to a feature layer:

  1. Set the feature layer to rendering in DYNAMIC mode
  2. Define a renderer which will be used to render the feature layer
  3. Set the renderer's scene property extrusion mode
  4. Set the renderer's scene property extrusion expression
  5. Set the renderer to the feature layer
  6. Add the feature layer to the scene

Extrusion can also be applied to graphics overlays:

  1. Define a renderer which will be used to render the graphics overlay
  2. Set the renderer's scene property extrusion mode
  3. Set the renderer's scene property extrusion expression
  4. Set the renderer to the graphics overlay

// create a simple renderer that uses a (polygon) fill symbol
var lineSym = new SimpleLineSymbol(SimpleLineSymbolStyle.Solid, Color.Black, 1);
var fillSym = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.Green, lineSym);
var rendrr = new SimpleRenderer(fillSym);

// set the rendering mode (absolute) and the expression (population attribute name)
rendrr.SceneProperties.ExtrusionMode = ExtrusionMode.AbsoluteHeight;
rendrr.SceneProperties.ExtrusionExpression = "pop2000";

// apply the renderer to the first graphics overlay in the scene view
MySceneView.GraphicsOverlays[0].Renderer = rendrr;

The following image shows a graphic overlay of US counties extruded based on a population attribute.

Map scene showing county polygons extruded to indicate relative population.

Only graphics overlays can have rotation expressions--used to change the heading, pitch and roll of the graphics in the graphics overlay. To set rotation expressions:

  1. Define a renderer which will be used to render the graphics overlay
  2. Set the rotation type
  3. Set the renderer's scene property heading expression
  4. Set the renderer's scene property pitch expression
  5. Set the renderer's scene property roll expression
  6. Set the renderer to the graphics overlay

// create a simple renderer that uses a (3D) cone symbol
var rendrr = new SimpleRenderer(coneSymbol);
// set expressions (attribute names) to define heading, pitch, and roll for each graphic
rendrr.SceneProperties.HeadingExpression = "heading";
rendrr.SceneProperties.PitchExpression = "pitch";
rendrr.SceneProperties.RollExpression = "roll";

Raster renderers

When initially created, a default renderer is used to display a raster layer. To customize the display, you can create a raster renderer (RasterRenderer) to define display properties and apply it to the layer.

The following code defines a color ramp and stretch parameters to create a stretch raster renderer.

double[] minVals = { 0 };
double[] maxVals = { 100 };
MinMaxStretchParameters minMaxParams = new MinMaxStretchParameters(minVals, maxVals);
ColorRamp elevationColorRamp = ColorRamp.Create(PresetColorRampType.Elevation);
var rendrr = new StretchRenderer(minMaxParams, null, true, elevationColorRamp);
inRasterLayer.Renderer = rendrr;

RasterRenderer is the base class inherited by all renderers available to display a raster layer and allows you to control how raster data are presented (visualized). Each of the following renderers are types of RasterRenderer and can be used to display your raster layer in different ways.

  • HillshadeRenderer—Creates a grayscale 3D representation of an elevation surface, with the sun's (hypothetical) position taken into account for shading the image. It can be applied to a raster layer created with single-band raster data.
  • BlendRenderer—Blends a hillshade image (derived from the raster) with the original raster. This provides a look similar to the original raster but with some terrain shading, for a rich, textured look.
  • ColormapRenderer—Provides a discrete mapping of raster pixel values to colors. All pixels matching the specified value are rendered using the mapped color. This can be useful for tasks such as land classification.
  • StretchRenderer—Displays continuous raster cell values across a gradual ramp of colors. Use the stretch renderer to draw a single band of continuous data. The stretch renderer works well when you have a large range of values to display, such as in imagery, aerial photographs, or elevation models.
  • RGBRenderer—Uses the same methods as the stretch renderer but allows you to combine bands as red, green, and blue composites.

Example of a blend renderer showing elevation with hillshade.

Raster functions can also be used to apply on-the-fly processing to rasters to apply hillshade, colormaps, color ramps, and so on. See the Add raster data topic for more information.

Raster rendering rules

A rendering rule defines how a requested raster image should be rendered or processed. ImageServiceRaster allows you to apply service-defined or client-defined rendering rules on an image service by setting its rendering rule property. You can create a RenderingRule from a RenderingRuleInfo object or a JSON string that specifies a service-defined or client-defined rendering rule and then set it on the image service raster. For the syntax of rendering rules, see raster function (JSON) objects in the ArcGIS REST API help.

private void AddRasterWithRenderingRule(RenderingRuleInfo ruleInfo)
    // Create an image service raster from a URI
    ImageServiceRaster serviceRaster = new ImageServiceRaster(new Uri(""));

    // Use RenderingRuleInfo to create a rendering rule
    RenderingRule renderingRule = new RenderingRule(ruleInfo);

    // Apply the rendering rule to the image service raster
    serviceRaster.RenderingRule = renderingRule;

    // Create a raster layer to display the raster
    RasterLayer layer = new RasterLayer(serviceRaster);

    // Dispatch to the UI thread to show the raster layer as a basemap
    Dispatcher.Invoke(() =>
        MyMapView.Map = new Map(new Basemap(layer));

Alternatively you can create a RenderingRule using a JSON string that specifies a service-defined or client-defined rendering rule.

// Use a JSON string to define the RenderingRule
RenderingRule renderingRule = new RenderingRule("{\"rasterFunction\" : \"Hillshade\",\"rasterFunctionArguments\" : {\"Azimuth\" : 215.0,\"Altitude\" : 75.0,\"ZFactor\" : 0.3},\"variableName\" : \"DEM\"}");

Symbolize graphics

Graphics provide a basic way to display geometry on top of the map. Graphics are unique in that they can be symbolized using a renderer for the overlay that contains them or by applying a symbol directly to the graphic. For a description of how to work with graphics, see Add graphics and text to graphics overlays. To apply symbols to features (as opposed to graphics), create a renderer.

The following example shows how to create a point graphic, apply a symbol, then display it on the map.


A symbol applied directly to a graphic overrides the symbol applied through the graphics overlay's renderer.

Apply styles to layers

Some layers that don’t support symbols and renderers, such ArcGIS vector tiled layers and WMS, offer styles as a way to control the display of the features they contain. These layers use a default style and also provide the option to apply other available styles.


The styles described here are not the styles you can create using ArcGIS Pro (.stylx). For information about reading symbols from such a style file, see Read symbols from a map or style file.

ArcGIS vector tiled layer styles

With ArcGIS Runtime SDK you can display vector basemaps with your own custom style. The ArcGIS Vector Tile Style Editor allows you to interactively create a style for one of the Esri vector basemaps and save it in ArcGIS Online as a portal item. You can then open it from the portal item to display it in your map with the custom style.

The ArcGIS Vector Tile Style editor.

Hands-on instructions for creating a custom style and displaying it in an ArcGIS Runtime app are in the Display a styled vector basemap DevLab.

WMS styles

WMS servers provide clients with a list of supported styles for each layer. At run time, you can choose which style the WMS server uses to render map images. In general, styles are predefined and cannot be changed or added to.

The styles property of the WmsLayerInfo class can be inspected to determine if there are styles available. The current style property of a WMS sublayer can be set to select a specific style.

// Search for and apply a specific style on sublayers that support it
foreach(WmsSublayer sublayer in _myWMSLayer.Sublayers)
    if (sublayer.SubLayerInfo.Styles.Contains("ArcGIS"))
        // Set the style
        sublayer.CurrentStyle = "ArcGIS";