Simple renderer

View inC++QMLView on GitHubSample viewer app

Display common symbols for all graphics in a graphics overlay with a renderer.

screenshot

Use case

Graphics are often used to display data that changes location regularly because they are held in memory instead of being persisted to the map. When a number of graphics are required to share the same style, a simple renderer can be applied to the graphics overlay containing the graphics. For example, the location of mobile taxis from a same company could be plotted on a map with each taxi marked by a relevant symbol.

How to use the sample

The sample loads with a predefined simple renderer, which displays a red cross simple marker symbol for the graphics in the graphics overlay.

How it works

A GraphicsOverlay is added to the MapView. A SimpleRenderer is created in the GraphicsOverlay which sets a red cross SimpleMarkerSymbol as its symbol. Three Graphics are added using Points.

  1. Create a GraphicsOverlay.
  2. Create a number of Point objects with x, y and spatial reference parameters.
  3. Create a SimpleMarkerSymbol passing in a SimpleMarkerSymbolStyle, color and size as parameters.
  4. Create a SimpleRenderer and set the SimpleMarkerSymbol as its symbol.
  5. Create a number of Graphic objects with the points initiated in step 2.

Relevant API

  • Graphic
  • GraphicsOverlay
  • Point
  • SimpleMarkerSymbol
  • SimpleRenderer

Additional information

Renderers are used to display graphics that don't already have a symbol set. A renderer will not override a graphic's symbol if one has been set.

Tags

graphics, marker, renderer, symbol, symbolize, symbology

Sample Code

Simple_Renderer.qml
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
// [WriteFile Name=Simple_Renderer, Category=DisplayInformation]
// [Legal]
// Copyright 2016 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.
// [Legal]

import QtQuick 2.6
import Esri.ArcGISRuntime 100.15

Rectangle {
    clip: true
    width: 800
    height: 600

    // Map view UI presentation at top
    MapView {
        id: mapView
        anchors.fill: parent

        Component.onCompleted: {
            // Set the focus on MapView to initially enable keyboard navigation
            forceActiveFocus();
        }

        Map {
            Basemap {
                initStyle: Enums.BasemapStyleArcGISImageryStandard
            }

            Envelope {
                id: envelope
                xMin: -110.828140
                yMin: 44.460458
                xMax: -110.829381
                yMax: 44.462735
                spatialReference: Factory.SpatialReference.createWgs84()
            }

            // set initial Viewpoint
            onLoadStatusChanged: {
                if (loadStatus === Enums.LoadStatusLoaded)
                    mapView.setViewpointGeometryAndPadding(envelope, 50);
            }
        }

        // create graphic overlay
        GraphicsOverlay {

            // set renderer for overlay
            SimpleRenderer {

                // set symbol as red cross
                SimpleMarkerSymbol {
                    style: Enums.SimpleMarkerSymbolStyleCross
                    color: "red"
                    size: 12
                }
            }

            // add the points to be rendered
            Graphic {

                // Old Faithful
                Point {
                    x: -110.828140
                    y: 44.460458
                    spatialReference: Factory.SpatialReference.createWgs84()
                }
            }

            Graphic {

                // Cascade Geyser
                Point {
                    x: -110.829004
                    y: 44.462438
                    spatialReference: Factory.SpatialReference.createWgs84()
                }
            }

            Graphic {

                // Plume Geyser
                Point {
                    x: -110.829381
                    y: 44.462735
                    spatialReference: Factory.SpatialReference.createWgs84()
                }
            }
        }
    }
}

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

You can no longer sign into this site. Go to your ArcGIS portal or the ArcGIS Location Platform dashboard to perform management tasks.

Your ArcGIS portal

Create, manage, and access API keys and OAuth 2.0 developer credentials, hosted layers, and data services.

Your ArcGIS Location Platform dashboard

Manage billing, monitor service usage, and access additional resources.

Learn more about these changes in the What's new in Esri Developers June 2024 blog post.

Close