Find nearest vertex

View on GitHubSample viewer app

Find the closest vertex and coordinate of a geometry to a point.

Image of find nearest vertex

Use case

Determine the shortest distance between a location and the boundary of an area. For example, developers can snap imprecise user clicks to a geometry if the click is within a certain distance of the geometry.

How to use the sample

Click anywhere on the map. A magenta cross will show at that location. A blue circle will show the polygon's nearest vertex to the point that was clicked. A red diamond will appear at the coordinate on the geometry that is nearest to the point that was clicked. If clicked inside the geometry, the red and magenta markers will overlap. The information box showing distance between the clicked point and the nearest vertex/coordinate will be updated with every new location clicked.

How it works

  1. Get a Geometry and a Point to check the nearest vertex against.
  2. Call GeometryEngine.nearestVertex(inputGeometry, point).
  3. Use the returned ProximityResult to get the Point representing the polygon vertex, and to determine the distance between that vertex and the clicked point.
  4. Call GeometryEngine.nearestCoordinate(inputGeometry, point).
  5. Use the returned ProximityResult to get the Point representing the coordinate on the polygon, and to determine the distance between that coordinate and the clicked point.

Relevant API

  • GeometryEngine
  • ProximityResult

Additional information

The value of ProximityResult.distance is planar (Euclidean) distance. Planar distances are only accurate for geometries that have a defined projected coordinate system, which maintain the desired level of accuracy. The example polygon in this sample is defined in California State Plane Coordinate System - Zone 5 (WKID 2229), which maintains accuracy near Southern California. Accuracy declines outside the state plane zone.

This sample uses the GeoView-Compose Toolkit module to be able to implement a composable MapView.

Tags

analysis, coordinate, geometry, geoview-compose, nearest, proximity, toolkit, vertex

Sample Code

FindNearestVertexViewModel.ktFindNearestVertexViewModel.ktMainActivity.ktFindNearestVertexScreen.kt
Use dark colors for code blocksCopy
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
/* Copyright 2025 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.
 *
 */

package com.esri.arcgismaps.sample.findnearestvertex.components

import android.app.Application
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.lifecycle.AndroidViewModel
import androidx.lifecycle.viewModelScope
import com.arcgismaps.Color
import com.arcgismaps.geometry.GeometryEngine
import com.arcgismaps.geometry.Point
import com.arcgismaps.geometry.Polygon
import com.arcgismaps.geometry.PolygonBuilder
import com.arcgismaps.geometry.SpatialReference
import com.arcgismaps.mapping.ArcGISMap
import com.arcgismaps.mapping.PortalItem
import com.arcgismaps.mapping.Viewpoint
import com.arcgismaps.mapping.layers.FeatureLayer
import com.arcgismaps.mapping.symbology.SimpleFillSymbol
import com.arcgismaps.mapping.symbology.SimpleFillSymbolStyle
import com.arcgismaps.mapping.symbology.SimpleLineSymbol
import com.arcgismaps.mapping.symbology.SimpleLineSymbolStyle
import com.arcgismaps.mapping.symbology.SimpleMarkerSymbol
import com.arcgismaps.mapping.symbology.SimpleMarkerSymbolStyle
import com.arcgismaps.mapping.view.Graphic
import com.arcgismaps.mapping.view.GraphicsOverlay
import com.arcgismaps.mapping.view.SingleTapConfirmedEvent
import com.arcgismaps.portal.Portal
import com.arcgismaps.toolkit.geoviewcompose.MapViewProxy
import com.esri.arcgismaps.sample.sampleslib.components.MessageDialogViewModel
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.asStateFlow
import kotlinx.coroutines.launch

class FindNearestVertexViewModel(application: Application) : AndroidViewModel(application) {
    // California zone 5 (ftUS) state plane coordinate system.
    private val statePlaneCaliforniaZone5SpatialReference = SpatialReference(2229)

    // create a portal
    private val portal = Portal("https://arcgisruntime.maps.arcgis.com")

    // get the USA States Generalized Boundaries layer from the portal using its ID
    private val portalItem =
        PortalItem(
            portal = portal,
            itemId = "8c2d6d7df8fa4142b0a1211c8dd66903"
        )

    // create a feature layer from the portal item
    private val usStatesGeneralizedLayer =
        FeatureLayer.createWithItemAndLayerId(
            item = portalItem,
            layerId = 0
        )

    // create a MapViewProxy to interact with the MapView
    val mapViewProxy = MapViewProxy()

    // create graphic symbol for the tapped location
    private val tappedLocationGraphic =
        Graphic(
            symbol = SimpleMarkerSymbol(
                style = SimpleMarkerSymbolStyle.X,
                color = Color.magenta,
                size = 15f
            )
        )

    // create graphic symbol for the nearest coordinate
    private val nearestCoordinateGraphic =
        Graphic(
            symbol = SimpleMarkerSymbol(
                style = SimpleMarkerSymbolStyle.Diamond,
                color = Color.red,
                size = 10f
            )
        )

    // create graphic symbol for the nearest vertex
    private val nearestVertexGraphic =
        Graphic(
            symbol = SimpleMarkerSymbol(
                style = SimpleMarkerSymbolStyle.Circle,
                color = Color.blue,
                size = 15f
            )
        )

    // create a polygon geometry
    private val polygon = PolygonBuilder(statePlaneCaliforniaZone5SpatialReference) {
        addPoint(Point(x = 6627416.41469281, y = 1804532.53233782))
        addPoint(Point(x = 6669147.89779046, y = 2479145.16609522))
        addPoint(Point(x = 7265673.02678292, y = 2484254.50442408))
        addPoint(Point(x = 7676192.55880379, y = 2001458.66365744))
    }.toGeometry()

    // set up the outline and fill color of the polygon
    private val polygonOutlineSymbol =
        SimpleLineSymbol(
            style = SimpleLineSymbolStyle.Solid,
            color = Color.green,
            width = 2f
        )

    private val polygonFillSymbol =
        SimpleFillSymbol(
            style = SimpleFillSymbolStyle.ForwardDiagonal,
            color = Color.green,
            outline = polygonOutlineSymbol
        )

    // create a polygon graphic
    private val polygonGraphic =
        Graphic(
            geometry = polygon,
            symbol = polygonFillSymbol
        )

    // create a graphics overlay to show the polygon, tapped location, and nearest vertex/coordinate
    val graphicsOverlay = GraphicsOverlay(
        listOf(
            polygonGraphic,
            tappedLocationGraphic,
            nearestCoordinateGraphic,
            nearestVertexGraphic
        )
    )

    val arcGISMap by mutableStateOf(
        ArcGISMap(statePlaneCaliforniaZone5SpatialReference).apply {
            // set the map viewpoint to the polygon
            initialViewpoint =
                Viewpoint(
                    center = polygon.extent.center,
                    scale = 8e6
                )
        }
    )

    // state flow of nearest vertex distance and nearest coordinate distance for presentation in UI
    private val _distanceInformationFlow = MutableStateFlow<DistanceInformation?>(null)
    val distanceInformationFlow = _distanceInformationFlow.asStateFlow()

    // create a message dialog view model for handling error messages
    val messageDialogVM = MessageDialogViewModel()

    init {
        viewModelScope.launch {
            arcGISMap.load().onSuccess {
                // add the USA States Generalized Boundaries feature layer to the map's operational layers
                arcGISMap.operationalLayers.add(usStatesGeneralizedLayer)
            }.onFailure { error ->
                messageDialogVM.showMessageDialog(
                    title = "Failed to load map",
                    description = error.message ?: "No description"
                )
            }
        }
    }

    /**
     * Handle a tap from the user and call [findNearestVertex].
     */
    fun onMapViewTapped(event: SingleTapConfirmedEvent) {
        event.mapPoint?.let { point ->
            findNearestVertex(tapPoint = point, polygon = polygon)
        }
    }

    /**
     * Finds the nearest vertex to the [tapPoint] on the [polygon].
     */
    private fun findNearestVertex(tapPoint: Point, polygon: Polygon) {
        // show where the user clicked
        tappedLocationGraphic.geometry = tapPoint
        // use the geometry engine to get the nearest vertex
        val nearestVertexResult =
            GeometryEngine.nearestVertex(geometry = polygon, point = tapPoint)
        // set the nearest vertex graphic's geometry to the nearest vertex
        nearestVertexGraphic.geometry = nearestVertexResult?.coordinate
        // use the geometry engine to get the nearest coordinate
        val nearestCoordinateResult =
            GeometryEngine.nearestCoordinate(geometry = polygon, point = tapPoint)
        // set the nearest coordinate graphic's geometry to the nearest coordinate
        nearestCoordinateGraphic.geometry = nearestCoordinateResult?.coordinate
        // calculate the distances to the nearest vertex and nearest coordinate then convert to kilometers
        val vertexDistance = nearestVertexResult?.distance?.metersToKilometers()?.toInt()
        val coordinateDistance = nearestCoordinateResult?.distance?.metersToKilometers()?.toInt()
        if (vertexDistance != null && coordinateDistance != null) {
            // update the distance information so the UI can display it
            _distanceInformationFlow.value = DistanceInformation(
                vertexDistance = vertexDistance,
                coordinateDistance = coordinateDistance
            )
        }
    }

    /**
     * Define a blue color for the nearest vertex graphic.
     */
    private val Color.Companion.blue: Color
        get() {
            return fromRgba(r = 0, g = 0, b = 255, a = 255)
        }

    /**
     * Define a magenta color for the tapped location graphic.
     */
    private val Color.Companion.magenta: Color
        get() {
            return fromRgba(r = 255, g = 0, b = 255, a = 255)
        }

    /**
     * Converts a quantity in meters to kilometers.
     */
    private fun Double.metersToKilometers(): Double {
        return this / 1000.0
    }

    /**
     * Data class representing vertex distance and coordinate distance.
     */
    data class DistanceInformation(val vertexDistance: Int, val coordinateDistance: Int)
}

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