Skip To Content ArcGIS for Developers Sign In Dashboard

ArcGIS Runtime SDK for .NET

Add graphics with renderer

This code sample is available for these platforms:
View Sample on GitHub

A renderer allows you to change the style of all graphics in a graphics overlay by referencing a single symbol style.

Image of adding graphics with renderer

Use case

A renderer allows you to change the style of all graphics in an overlay by only changing one copy of the symbol. For example, a user may wish to display a number of graphics on a map of parkland which represent trees, all sharing a common symbol. A renderer will only effect graphics that do not specify their own symbol style.

How to use the sample

Run the sample and view graphics for points, lines, and polygons, which are stylized using renderers.

How it works

  1. Create a GraphicsOverlay and add it to the MapView.
  2. Create a Graphic, specifying only a Geometry.
  3. Create a single Symbol such as a SimpleMarkerSymbol.
  4. Create a renderer with the Symbol such as new SimpleRenderer(symbol).
  5. Set the renderer on the GraphicsOverlay with graphicsOverlay.Renderer = renderer.

Relevant API

  • Geometry
  • Graphic
  • GraphicsOverlay
  • SimpleFillSymbol
  • SimpleLineSymbol
  • SimpleMarkerSymbol
  • SimpleRenderer

Additional information

To set unique symbols across a number of graphics (e.g. showing graphics of individual landmarks) see "Add graphics with symbols" sample.

Tags

GraphicsOverlay, SimpleMarkerSymbol, SimpleRenderer

Sample Code

<UserControl
    x:Class="ArcGISRuntime.UWP.Samples.AddGraphicsRenderer.AddGraphicsRenderer"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:esriUI="using:Esri.ArcGISRuntime.UI.Controls"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">

    <Grid>
        <esriUI:MapView x:Name="MyMapView"/>
    </Grid>
</UserControl>
// Copyright 2019 Esri.
//
// Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.
// You may obtain a copy of the License at: http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific
// language governing permissions and limitations under the License.

using Esri.ArcGISRuntime.Geometry;
using Esri.ArcGISRuntime.Mapping;
using Esri.ArcGISRuntime.Symbology;
using Esri.ArcGISRuntime.UI;
using System.Drawing;

namespace ArcGISRuntime.UWP.Samples.AddGraphicsRenderer
{
    [ArcGISRuntime.Samples.Shared.Attributes.Sample(
        name: "Add graphics with renderer",
        category: "GraphicsOverlay",
        description: "A renderer allows you to change the style of all graphics in a graphics overlay by referencing a single symbol style.",
        instructions: "Run the sample and view graphics for points, lines, and polygons, which are stylized using renderers.",
        tags: new[] { "GraphicsOverlay", "SimpleMarkerSymbol", "SimpleRenderer" })]
    public sealed partial class AddGraphicsRenderer
    {
        public AddGraphicsRenderer()
        {
            InitializeComponent();
            Initialize();
        }

        private void Initialize()
        {
            // Create a map with 'Imagery with Labels' basemap.
            Map myMap = new Map(Basemap.CreateImageryWithLabels());

            // Assign the map to the MapView.
            MyMapView.Map = myMap;

            // Create a center point for the graphics.
            MapPoint centerPoint = new MapPoint(-117.195800, 34.056295, SpatialReferences.Wgs84);

            // Create an envelope from that center point.
            Envelope pointExtent = new Envelope(centerPoint, .07, .035);

            // Create a collection of points on the corners of the envelope.
            PointCollection points = new PointCollection(SpatialReferences.Wgs84)
            {
                new MapPoint(pointExtent.XMax, pointExtent.YMax),
                new MapPoint(pointExtent.XMax, pointExtent.YMin),
                new MapPoint(pointExtent.XMin, pointExtent.YMax),
                new MapPoint(pointExtent.XMin, pointExtent.YMin),
            };

            // Create overlay to where graphics are shown.
            GraphicsOverlay overlay = new GraphicsOverlay();

            // Add points to the graphics overlay.
            foreach (MapPoint point in points)
            {
                // Create new graphic and add it to the overlay.
                overlay.Graphics.Add(new Graphic(point));
            }

            // Create symbol for points.
            SimpleMarkerSymbol pointSymbol = new SimpleMarkerSymbol()
            {
                Color = Color.Yellow,
                Size = 30,
                Style = SimpleMarkerSymbolStyle.Square
            };

            // Create simple renderer with symbol.
            SimpleRenderer renderer = new SimpleRenderer(pointSymbol);

            // Set renderer to graphics overlay.
            overlay.Renderer = renderer;

            // Add created overlay to the MapView.
            MyMapView.GraphicsOverlays.Add(overlay);

            // Center the MapView on the points.
            MyMapView.SetViewpointGeometryAsync(pointExtent, 50);
        }
    }
}