Symbols, renderers, and styles

A symbol A symbol defines the properties used to display a geometry or text. Learn more defines display properties for features A feature is a single record, also known as a row, that represents a real-world entity. It typically contains a geometry (point, multipoint, polyline, or polygon) and attributes but it can also contain just attributes. Learn more and graphics A graphic is a visual element composed of a geometry, symbol, and attributes that is displayed on a map or scene. Learn more , which are types of geoelements A geoelement refers to any geographic element in a map or map view that can be identified by its location to return attribute information. Learn more . A geoelement has a geometry (location and shape) and optional attributes Attributes are fields and values for a single feature or non-spatial record. They are typically stored in a database or service such as a feature service. Learn more . Features and graphics also use a symbol to define display characteristics such as color, size, border, transparency, and so on. It’s important to remember, therefore, that a symbol is not the item being represented on the map. Instead, a symbol A symbol defines the properties used to display a geometry or text. Learn more controls how those items (graphics or features) appear. The relationship is similar, for example, between the words you are reading now (the content) and the font that is used to display them (presentation). Changing the font style, size, and color will not change the meaning of the text but is likely to have an impact on the effectiveness of the presentation. Likewise, the quality of a map’s presentation can improve with the proper use of symbols to convey information. Sometimes, the symbol A symbol defines the properties used to display a geometry or text. Learn more used by a feature or graphic is contained in a renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more .

A renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more is a collection of one or more symbols. When applied to a layer, graphics overlay A graphics overlay is a client-side, temporary container of graphics to display on a map view or scene view. Learn more , or compatible analysis visualization, a renderer displays data using the appropriate symbol. If it contains more than a single symbol, a renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more uses logic to determine the symbol A symbol defines the properties used to display a geometry or text. Learn more to apply to each geoelement A geoelement refers to any geographic element in a map or map view that can be identified by its location to return attribute information. Learn more , based on one or several attribute values. A set of raster renderers are provided to display rasters and compatible analysis results according to their values.

Some layer types don’t support symbols A symbol defines the properties used to display a geometry or text. Learn more or renderers A renderer is a collection of rules and symbols used to display the data in a layer. Learn more , such as WMS and vector tile layers. These layers provide styles as an alternative method for changing how features A feature is a single record, also known as a row, that represents a real-world entity. It typically contains a geometry (point, multipoint, polyline, or polygon) and attributes but it can also contain just attributes. Learn more are displayed. As with symbols and renderers, styles determine how a layer’s content is presented.

Symbols

For features A feature is a single record, also known as a row, that represents a real-world entity. It typically contains a geometry (point, multipoint, polyline, or polygon) and attributes but it can also contain just attributes. Learn more and graphics A graphic is a visual element composed of a geometry, symbol, and attributes that is displayed on a map or scene. Learn more to appear on a map, they must be assigned a symbol A symbol defines the properties used to display a geometry or text. Learn more . There are a variety of symbol types you can create to display them, with properties such as color, size, and symbol style that you can modify. While each symbol A symbol defines the properties used to display a geometry or text. Learn more type requires a specific geometry type (point, line, or polygon), you are not restricted to use those symbols exclusively for a given geometry. If you’re symbolizing a line, for example, you can choose to use a marker symbol to display the line’s vertices (points). Also, symbols A symbol defines the properties used to display a geometry or text. Learn more may have different capabilities when used in 2D (map) or 3D (scene).

The following symbols A symbol defines the properties used to display a geometry or text. Learn more models are available:

• Simple symbols follow the web map specification. You can create these using the simple symbology API, or get them from web maps and feature services when advanced symbology is turned off.

• Advanced symbols follow the ArcGIS Pro symbol model. You can create these using the multilayer symbol classes, or get them from feature services, mobile style files, dictionary renderers, and mobile map packages.

When authoring maps in ArcGIS Pro ArcGIS Pro is a professional desktop GIS application that can explore, visualize, analyze, and manage 2D and 3D data. Learn more , you can choose to use symbology compatible with all clients or to use advanced symbology. The ArcGIS Online ArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account. Learn more Map Viewer and apps built with this SDK are capable of rendering advanced symbology. The ArcGIS Online Map Viewer classic uses downgraded symbology when rendering advanced symbols.

You should use advanced symbols A symbol defines the properties used to display a geometry or text. Learn more via multilayer symbols APIs or style files (.stylx) created from ArcGIS Pro. Advanced symbols, also known as Cartographic Information Model (CIM) symbols A Cartographic Information Model (CIM) symbol is an advanced, multi-layer symbol produced by ArcGIS Pro, client APIs, or developer code. Learn more , are vectorized representations that scale well and perform better than simple symbols Simple symbols are symbols that follow the web map specification. Developers can create and work with them through the simple symbol classes. Learn more . ArcGIS ArcGIS is the brand name for all of the desktop, server, and developer products and technologies offered by Esri. Learn more is moving towards full support for advanced symbols, they are now supported by the ArcGIS Maps SDK for JavaScript and in the ArcGIS Online ArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account. Learn more Map Viewer. In instances where advanced symbols do not render as expected in a particular context, you can use simple symbols.

The following example creates a SimpleFillSymbol that uses a SimpleLineSymbol to define its outline:

// Create a solid while line symbol.
final simpleLineSymbol = SimpleLineSymbol(
  style: SimpleLineSymbolStyle.solid,
  color: Colors.white,
  width: 2.0,
);

// Create a solid red fill symbol with a white outline.
final simpleFillSymbol = SimpleFillSymbol(
  style: SimpleFillSymbolStyle.solid,
  color: Colors.red,
  outline: simpleLineSymbol,
);

The following code creates a SimpleMarkerSceneSymbol to define a 3D symbol for display in a ArcGISScene:

// Create an orange cone where the bottom of the
// symbol is the anchor point.
final pointSymbol = SimpleMarkerSceneSymbol(
  style: SimpleMarkerSceneSymbolStyle.cone,
  color: Colors.orange,
  height: 15,
  width: 15,
  depth: 15,
  anchorPosition: SceneSymbolAnchorPosition.bottom,
);

Renderers

A renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more contains a set of symbols and controls how data in a layer, graphics overlay A graphics overlay is a client-side, temporary container of graphics to display on a map view or scene view. Learn more , or compatible analysis visualization are displayed. Renderers use data values, such as an attribute value, raster cell value, or analysis result value, to determine the symbol to apply. There are a variety of renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more types, some for feature layers and graphics overlays and some for rasters and analysis results, each designed to use a different rendering logic.

Renderers are used to symbolize feature or raster layers, since symbols cannot be applied directly to that data. A renderer A renderer is a collection of rules and symbols used to display the data in a layer. Learn more can also be applied to a graphics overlay A graphics overlay is a client-side, temporary container of graphics to display on a map view or scene view. Learn more but may not be appropriate if the overlay has graphics of mixed geometry types. For such a scenario, applying the appropriate symbol directly to each graphic may be the preferred workflow. Some renderers can also be supplied to a FieldAnalysis to visualize dynamic analysis results in an AnalysisOverlay.

Renderers A renderer is a collection of rules and symbols used to display the data in a layer. Learn more can be updated at run time, allowing your user to dynamically visualize data in the map.

Feature layers and graphics overlays

The following are the types of renderers available for feature layers and graphics overlays:

• SimpleRenderer — A simple renderer A simple renderer is a renderer that defines a single symbol used to display all features in a layer. Learn more displays all features in a layer or graphics overlay A graphics overlay is a client-side, temporary container of graphics to display on a map view or scene view. Learn more using the same symbol. For example, display all points in the world cities layer as a small red square.

• UniqueValueRenderer — Applies a unique symbol for each specified value of an attribute (or combination of attributes). A unique value renderer A unique value renderer is a renderer that defines a distinct symbol for each unique data value returned from a field or expression in a layer. Learn more can be based on any data type but is typically used with string attributes. For example, display points in the world cities layer using two symbols: a small gray triangle for features with a value of N for the CAPITAL attribute and a large yellow star for those with a value of Y.

• ClassBreaksRenderer — Symbolizes features or graphics according to specific ranges of values for an attribute. The attribute used for a class breaks renderer A class breaks renderer is a renderer that classifies numeric data into two or more ranges of values to create a visualization. Each class (or range) is defined by a lower and an upper value and a unique symbol. Learn more must be numeric. For example, display world city POPULATION value with three different symbols based on size range: a small blue circle for cities with a value between 0 and 100000, a slightly larger blue circle for cities with a value between 100001 and 2999999, and a larger blue circle for cities with a value over 3000000.

• DictionaryRenderer — Renders features or graphics by constructing multilayer symbols from a style file A style file is a .stylx file created in ArcGIS Pro that contains symbol primitives, such as the symbol frame, lines that make up inner icons. Learn more and associated attribute values. A dictionary renderer A dictionary renderer is a renderer that uses a style file generated in ArcGIS Pro from a rule engine and is used to display types of advanced symbology on a map, such as military symbology. Learn more is commonly used to display military symbology. See the Display symbols with a dictionary renderer topic for details.

The following image shows a layer with a class breaks renderer. The renderer displays features as five classes of population, each with a different symbol (a darker or lighter shade of red).

A SimpleRenderer that uses a SimpleMarkerSymbol for displaying all features. This renderer could be applied to a FeatureLayer or GraphicsOverlay:

// Create a simple renderer using a simple marker symbol.
final renderer = SimpleRenderer(
  symbol: SimpleMarkerSymbol(
    style: SimpleMarkerSymbolStyle.circle,
    color: Colors.teal,
    size: 12,
  ),
);

Raster layers

The following raster renderers are available to control how raster A raster is a matrix of cells (or pixels) organized into rows and columns (or a grid) where each cell contains a value representing information, such as temperature. Rasters include digital aerial photographs, imagery from satellites, digital pictures, and scanned maps. Learn more data and compatible field analysis results are displayed.

• HillshadeRenderer — Renders elevation data as shaded relief in grayscale, using a hypothetical sun position to calculate light and shadow. Use this renderer with single-band elevation raster A raster is a matrix of cells (or pixels) organized into rows and columns (or a grid) where each cell contains a value representing information, such as temperature. Rasters include digital aerial photographs, imagery from satellites, digital pictures, and scanned maps. Learn more data in a raster layer A raster layer is a layer type that allows developers to display raster data in their applications. Learn more when you want to reveal terrain shape and depth. Common uses include DEM visualization, terrain context layers, and cartographic relief effects.

• BlendRenderer — Applies a ColorRamp and blends it with hillshade to emphasize high and low elevation while preserving terrain relief. Use PresetColorRampType for common elevation, surface, temperature, precipitation, or bathymetry visualizations, or use custom color ramps when specific value ranges need emphasis.

• ColormapRenderer — Maps discrete cell values to specific colors. Use this renderer for classified or thematic rasters where each category code needs a defined color. Common uses include land cover classes, suitability classes, risk zones, masks, and other integer rasters. A colormap can also support interactive workflows where category colors are updated dynamically.

• StretchRenderer — Stretches continuous raster values to improve visual contrast. Use this renderer with a ColorRamp when source values are concentrated in a narrow range or when you want to reveal continuous patterns with a meaningful gradient. Common uses include satellite imagery, grayscale band display, elevation rasters, temperature rasters, and other continuous surfaces.

• RgbRenderer — Combines selected raster bands into red, green, and blue channels. Use this renderer for multiband rasters when creating true-color or false-color composites. Common uses include natural color imagery, near-infrared composites, and vegetation-focused visual analysis.

Raster renderers often use either a ColorRamp or a Colormap, depending on the type of values being displayed. For continuous raster data or continuous field analysis results, such as elevation, temperature, precipitation, or bathymetry, use a ColorRamp with a StretchRenderer or BlendRenderer to display values with a smooth gradient. Use PresetColorRampType for common visualization patterns. This includes ramps designed for accessibility, including ramps from the cividis color ramp family that are designed to be more accessible for users with color vision deficiencies. When preset ramps don’t provide enough control, create a custom ColorRamp from a list of colors or weighted ColorStops to control how values transition across the range.

For discrete or classified raster data, such as land cover, suitability classes, or masks, use a ColormapRenderer with a Colormap that maps each raster cell value to a specific color. The same approach can be used for discrete or boolean field analysis results, for example, to symbolize true and false values from a BooleanFieldFunction with distinct colors in a FieldAnalysis. This approach is useful when categories must remain visually distinct or when an app needs to let users change category colors at run time.

When rendering a raster layer, also choose a resampling method that matches the type of data. The RasterLayer.resamplingType property controls how raster cell values are calculated when the layer is displayed at a different resolution or transformed. Use nearest-neighbor resampling for discrete or boolean data to preserve category values, and bilinear interpolation for continuous data to create smoother transitions between values. The default automatic setting generally selects the appropriate method based on the raster’s properties, but explicitly set the property when the data type cannot be inferred, such as for a raster exported from a continuous or discrete field analysis result.

The following image shows a rendered raster of Madagascar using a hillshade renderer to show terrain relief with light and shadow.

The following code applies a ColormapRenderer to a raster layer created from the result of a map algebra calculation using the spatial analysis APIs. The full example categorizes elevation values into geomorphic classes, exports the classified result to a raster, and then uses a colormap to assign a distinct color to each class before adding the layer to the map:

// Define a renderer for the different geomorphic categories.
final colors = {
  1: Colors.blue.shade600, // Raised shoreline.
  2: Colors.teal.shade200, // Ice covered.
  3: Colors.brown, // Ice-free high ground.
};

// Create a colormap renderer using the defined categories.
final colormap = Colormap.fromValuesAndColors(colors);
final colormapRenderer = ColormapRenderer.withColormap(colormap);

// Set the colormap renderer to the results raster layer and apply an opacity.
resultsRasterLayer!.renderer = colormapRenderer;
resultsRasterLayer!.opacity = 0.5;

// Add the results raster layer to the map.
mapViewController.arcGISMap!.operationalLayers.add(resultsRasterLayer!);

Styles

Layers can also be rendered using a style. Styles are containers that can store symbols, colors, and several other types of information used for rendering a layer. They promote consistency and standardization across your maps and scenes by defining a common set of symbology that can be shared between projects. In fact, the symbol galleries and color pickers you use when authoring maps and scenes in ArcGIS Pro or the ArcGIS Online Map Viewer are populated using styles. See the ArcGIS Pro Styles documentation for more information and a description of the types of styles.

Mobile style files

Mobile style files are one of several style types you can create in ArcGIS Pro. They let you apply symbol styles using a .stylx file that’s local to the device. This local file enables you to maintain style and branding consistency even when users are offline. Access symbols from the mobile style file using the SymbolStyle class.

// Create parks and trails feature layers from their service feature tables.
final parksServiceFeatureTable = ServiceFeatureTable.withUri(
  Uri.parse(
    'https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Parks_and_Open_Space/FeatureServer/0',
  ),
);
final parksFeatureLayer =
    FeatureLayer.withFeatureTable(parksServiceFeatureTable);

final trailsServiceFeatureTable = ServiceFeatureTable.withUri(
  Uri.parse(
    'https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0',
  ),
);
final trailsFeatureLayer =
    FeatureLayer.withFeatureTable(trailsServiceFeatureTable);

// Open a mobile style from a .stylx file.
final mobileStyle = SymbolStyle.withFileUri(mobileStyleFile.uri);

// Load the mobile style file before requesting symbols from it.
await mobileStyle.load();

// Get multilayer symbols from FireflyMobile.stylx using a list of one or more
// symbol identifiers (keys).
final parksSymbol = await mobileStyle.getSymbol(['FireflyPoly_8']);
final trailsSymbol = await mobileStyle.getSymbol(['FireflyLine_5']);

// Set the layer renderers to use the appropriate symbol from the mobile style.
parksFeatureLayer.renderer = SimpleRenderer(symbol: parksSymbol);
trailsFeatureLayer.renderer = SimpleRenderer(symbol: trailsSymbol);

Not all capabilities of ArcGIS Pro style files are supported in the mobile style file. The limitations are described in the Mobile styles section on the ArcGIS Pro Style page. For details on creating and applying a mobile style file, see the Create a mobile style for native apps blog.

ArcGIS vector tile layer styles

An ArcGIS vector tile layer A vector tile layer is a data layer used to access and display tiled data and its corresponding styles. Learn more doesn’t support symbols and renderers but instead offers a style as a way to control how the layer’s are displayed. It uses a default style and provides the option to apply other available styles. It consumes vector tiles and an associated style for drawing them. Because the style is separate from the underlying data, you can customize the style of an existing basemap layer. There are layers with many styles available through ArcGIS Online ArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account. Learn more . See Creative Vector Tile Layers and Web Maps for some examples.

You can create your own style with the ArcGIS Vector Tile Style Editor. Your customized vector layers can then be saved to and read from ArcGIS Online.

WMS styles

A WMS Web map service (WMS) is an Open Geospatial Consortium (OGC) standard that defines image-based map services. Learn more layer doesn’t support symbols and renderers but instead offers a style as a way to control how the layer’s are displayed. It uses a default style and provides the option to apply other available styles.

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

The styles defined in the layer information can be inspected to determine the styles (if any) that are available. The style of a WMS Web map service (WMS) is an Open Geospatial Consortium (OGC) standard that defines image-based map services. Learn more sublayer can be set to one of the available styles.