Add graphics with renderer

View inWPFUWPFormsiOSAndroid
View 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

AddGraphicsRenderer.cs
                                                                                                                       
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
// 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 Esri.ArcGISRuntime.UI.Controls;
using Foundation;
using System.Drawing;
using UIKit;

namespace ArcGISRuntime.Samples.AddGraphicsRenderer
{
    [Register("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 class AddGraphicsRenderer : UIViewController
    {
        // Hold references to UI controls.
        private MapView _myMapView;

        public AddGraphicsRenderer()
        {
            Title = "Add graphics (Renderer)";
        }

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

            // 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);
        }

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();
            Initialize();
        }

        public override void LoadView()
        {
            // Create the views.
            View = new UIView() { BackgroundColor = ApplicationTheme.BackgroundColor };

            _myMapView = new MapView();
            _myMapView.TranslatesAutoresizingMaskIntoConstraints = false;

            // Add the views.
            View.AddSubviews(_myMapView);

            // Lay out the views.
            NSLayoutConstraint.ActivateConstraints(new[]
            {
                _myMapView.TopAnchor.ConstraintEqualTo(View.SafeAreaLayoutGuide.TopAnchor),
                _myMapView.BottomAnchor.ConstraintEqualTo(View.BottomAnchor),
                _myMapView.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor),
                _myMapView.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor)
            });
        }
    }
}

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