Control graphic draw order

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
//
// 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.

import UIKit
import ArcGIS

class GraphicDrawOrderViewController: UIViewController {
    @IBOutlet var mapView: AGSMapView!
    @IBOutlet var buttons: [UIButton]!

    var map: AGSMap!

    private var graphicsOverlay = AGSGraphicsOverlay()
    private var graphics = [AGSGraphic]()

    private var drawIndex: Int = 0

    override func viewDidLoad() {
        super.viewDidLoad()

        // add the source code button item to the right of navigation bar
        (self.navigationItem.rightBarButtonItem as! SourceCodeBarButtonItem).filenames = ["GraphicDrawOrderViewController"]

        // create an instance of a map with ESRI streets basemap
        self.map = AGSMap(basemapStyle: .arcGISStreets)
        // assign map to the map view
        self.mapView.map = self.map

        // add the graphics overlay to the map view
        self.mapView.graphicsOverlays.add(self.graphicsOverlay)

        // add the graphics to the overlay
        self.addGraphics()

        // set map scale
        let mapScale: Double = 53500

        // initial viewpoint
        self.mapView.setViewpointCenter(AGSPoint(x: -13148960, y: 4000040, spatialReference: .webMercator()), scale: mapScale)

        // restricting map scale to preserve the graphics overlapping
        self.map.minScale = mapScale
        self.map.maxScale = mapScale
    }

    private func addGraphics() {
        // starting x and y
        let x: Double = -13149000
        let y: Double = 4e6
        // distance between the graphics
        let delta: Double = 100

        // blue marker
        var geometry = AGSPoint(x: x, y: y, spatialReference: .webMercator())
        var symbol = AGSPictureMarkerSymbol(image: UIImage(named: "BlueMarker")!)
        var graphic = AGSGraphic(geometry: geometry, symbol: symbol, attributes: nil)
        graphics.append(graphic)

        // red marker
        geometry = AGSPoint(x: x + delta, y: y, spatialReference: .webMercator())
        symbol = AGSPictureMarkerSymbol(image: UIImage(named: "RedMarker2")!)
        graphic = AGSGraphic(geometry: geometry, symbol: symbol, attributes: nil)
        graphics.append(graphic)

        // green marker
        geometry = AGSPoint(x: x, y: y + delta, spatialReference: .webMercator())
        symbol = AGSPictureMarkerSymbol(image: UIImage(named: "GreenMarker")!)
        graphic = AGSGraphic(geometry: geometry, symbol: symbol, attributes: nil)
        graphics.append(graphic)

        // Violet marker
        geometry = AGSPoint(x: x + delta, y: y + delta, spatialReference: .webMercator())
        symbol = AGSPictureMarkerSymbol(image: UIImage(named: "VioletMarker")!)
        graphic = AGSGraphic(geometry: geometry, symbol: symbol, attributes: nil)
        graphics.append(graphic)

        // add the graphics to the overlay
        self.graphicsOverlay.graphics.addObjects(from: graphics)
    }

    // MARK: - Actions

    @IBAction func buttonAction(_ sender: UIButton) {
        // increment draw index by 1 and assign as the zIndex for the respective graphic
        self.drawIndex += 1

        // the button's tag value specifies which graphic to re-index
        // for example, a button tag value of 1 will move self.graphics[1] - the red marker
        graphics[sender.tag].zIndex = self.drawIndex
    }
}