Skip to content

Commit 5b3ea28

Browse files
authored
Merge pull request #238 from Esri/des12437/Display-points-using-clustering-feature-reduction
[New] Display points using clustering feature reduction
2 parents d01f7fc + 45acfe9 commit 5b3ea28

File tree

5 files changed

+195
-0
lines changed

5 files changed

+195
-0
lines changed

Samples.xcodeproj/project.pbxproj

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,8 @@
8585
1C43BC852A43783900509BF8 /* SetVisibilityOfSubtypeSublayerView.Model.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1C43BC7C2A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.Model.swift */; };
8686
1C43BC862A43783900509BF8 /* SetVisibilityOfSubtypeSublayerView.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1C43BC7E2A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.swift */; };
8787
1C43BC872A43783900509BF8 /* SetVisibilityOfSubtypeSublayerView.Views.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1C43BC792A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.Views.swift */; };
88+
1C56B5E62A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1C56B5E22A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift */; };
89+
1C56B5E72A82C057000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1C56B5E22A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift */; };
8890
1C929F092A27B86800134252 /* ShowUtilityAssociationsView.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1CAF831B2A20305F000E1E60 /* ShowUtilityAssociationsView.swift */; };
8991
1C965C3929DB9176002F8536 /* ShowRealisticLightAndShadowsView.swift in Copy Source Code Files */ = {isa = PBXBuildFile; fileRef = 1C9B74C529DB43580038B06F /* ShowRealisticLightAndShadowsView.swift */; };
9092
1C9B74C929DB43580038B06F /* ShowRealisticLightAndShadowsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1C9B74C529DB43580038B06F /* ShowRealisticLightAndShadowsView.swift */; };
@@ -275,6 +277,7 @@
275277
dstPath = "";
276278
dstSubfolderSpec = 7;
277279
files = (
280+
1C56B5E72A82C057000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift in Copy Source Code Files */,
278281
D7ABA3002A3288970021822B /* ShowViewshedFromGeoelementInSceneView.swift in Copy Source Code Files */,
279282
1C3B7DCD2A5F652500907443 /* AnalyzeNetworkWithSubnetworkTraceView.Model.swift in Copy Source Code Files */,
280283
1C3B7DCE2A5F652500907443 /* AnalyzeNetworkWithSubnetworkTraceView.swift in Copy Source Code Files */,
@@ -418,6 +421,7 @@
418421
1C43BC792A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.Views.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SetVisibilityOfSubtypeSublayerView.Views.swift; sourceTree = "<group>"; };
419422
1C43BC7C2A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.Model.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SetVisibilityOfSubtypeSublayerView.Model.swift; sourceTree = "<group>"; };
420423
1C43BC7E2A43781100509BF8 /* SetVisibilityOfSubtypeSublayerView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SetVisibilityOfSubtypeSublayerView.swift; sourceTree = "<group>"; };
424+
1C56B5E22A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = DisplayPointsUsingClusteringFeatureReductionView.swift; sourceTree = "<group>"; };
421425
1C9B74C529DB43580038B06F /* ShowRealisticLightAndShadowsView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ShowRealisticLightAndShadowsView.swift; sourceTree = "<group>"; };
422426
1C9B74D529DB54560038B06F /* ChangeCameraControllerView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ChangeCameraControllerView.swift; sourceTree = "<group>"; };
423427
1CAB8D442A3CEAB0002AA649 /* RunValveIsolationTraceView.Model.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = RunValveIsolationTraceView.Model.swift; sourceTree = "<group>"; };
@@ -616,6 +620,7 @@
616620
F111CCBD288B548400205358 /* Display map from mobile map package */,
617621
D752D95B2A3BCDD4003EB25E /* Display map from portal item */,
618622
00B04FB3283EEB830026C882 /* Display overview map */,
623+
1C56B5DE2A82C02D000381DA /* Display points using clustering feature reduction */,
619624
E004A6D528465C70002A1FE6 /* Display scene */,
620625
E070A0A1286F3B3400F2B606 /* Download preplanned map area */,
621626
E004A6EE284E4B7A002A1FE6 /* Download vector tiles to local cache */,
@@ -872,6 +877,14 @@
872877
path = "Set visibility of subtype sublayer";
873878
sourceTree = "<group>";
874879
};
880+
1C56B5DE2A82C02D000381DA /* Display points using clustering feature reduction */ = {
881+
isa = PBXGroup;
882+
children = (
883+
1C56B5E22A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift */,
884+
);
885+
path = "Display points using clustering feature reduction";
886+
sourceTree = "<group>";
887+
};
875888
1C965C4629DBA879002F8536 /* 681d6f7694644709a7c830ec57a2d72b */ = {
876889
isa = PBXGroup;
877890
children = (
@@ -1614,6 +1627,7 @@
16141627
E004A6C128414332002A1FE6 /* SetViewpointRotationView.swift in Sources */,
16151628
883C121529C9136600062FF9 /* DownloadPreplannedMapAreaView.MapPicker.swift in Sources */,
16161629
1C9B74C929DB43580038B06F /* ShowRealisticLightAndShadowsView.swift in Sources */,
1630+
1C56B5E62A82C02D000381DA /* DisplayPointsUsingClusteringFeatureReductionView.swift in Sources */,
16171631
00E5401E27F3CCA200CF66D5 /* ContentView.swift in Sources */,
16181632
D7634FAF2A43B7AC00F8AEFB /* CreateConvexHullAroundGeometriesView.swift in Sources */,
16191633
E066DD382860AB28004D3D5B /* StyleGraphicsWithRendererView.swift in Sources */,
Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
// Copyright 2023 Esri
2+
//
3+
// Licensed under the Apache License, Version 2.0 (the "License");
4+
// you may not use this file except in compliance with the License.
5+
// You may obtain a copy of the License at
6+
//
7+
// https://www.apache.org/licenses/LICENSE-2.0
8+
//
9+
// Unless required by applicable law or agreed to in writing, software
10+
// distributed under the License is distributed on an "AS IS" BASIS,
11+
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
// See the License for the specific language governing permissions and
13+
// limitations under the License.
14+
15+
import ArcGIS
16+
import SwiftUI
17+
import ArcGISToolkit
18+
19+
struct DisplayPointsUsingClusteringFeatureReductionView: View {
20+
/// A map of global power plants.
21+
@State private var map = {
22+
let portalItem = PortalItem(
23+
portal: .arcGISOnline(connection: .anonymous),
24+
id: PortalItem.ID("8916d50c44c746c1aafae001552bad23")!
25+
)
26+
return Map(item: portalItem)
27+
}()
28+
29+
/// The power plants feature layer for querying.
30+
private var layer: FeatureLayer? {
31+
map.operationalLayers.first as? FeatureLayer
32+
}
33+
34+
/// The screen point to perform an identify operation.
35+
@State private var identifyScreenPoint: CGPoint?
36+
37+
/// The popup to be shown as the result of the layer identify operation.
38+
@State private var popup: Popup?
39+
40+
/// A Boolean value specifying whether the popup view should be shown or not.
41+
@State private var showsPopup = false
42+
43+
/// A Boolean value specifying whether the layer's feature reduction is shown.
44+
@State private var showsFeatureReduction = true
45+
46+
/// A Boolean value indicating whether to show an error alert.
47+
@State private var isShowingAlert = false
48+
49+
/// The error shown in the error alert.
50+
@State var error: Error? {
51+
didSet { isShowingAlert = error != nil }
52+
}
53+
54+
var body: some View {
55+
MapViewReader { proxy in
56+
MapView(map: map)
57+
.onSingleTapGesture { screenPoint, _ in
58+
identifyScreenPoint = screenPoint
59+
}
60+
.task(id: identifyScreenPoint) {
61+
guard let identifyScreenPoint,
62+
let layer,
63+
let identifyResult = try? await proxy.identify(
64+
on: layer,
65+
screenPoint: identifyScreenPoint,
66+
tolerance: 3
67+
),
68+
let firstPopup = identifyResult.popups.first
69+
else { return }
70+
self.popup = firstPopup
71+
self.showsPopup = true
72+
}
73+
.floatingPanel(
74+
selectedDetent: .constant(.half),
75+
horizontalAlignment: .leading,
76+
isPresented: $showsPopup
77+
) {
78+
Group {
79+
if let popup = popup {
80+
PopupView(popup: popup, isPresented: $showsPopup)
81+
.showCloseButton(true)
82+
}
83+
}
84+
.padding()
85+
}
86+
.toolbar {
87+
ToolbarItem(placement: .bottomBar) {
88+
Toggle("Feature clustering", isOn: $showsFeatureReduction)
89+
.toggleStyle(.switch)
90+
.onChange(of: showsFeatureReduction) { isEnabled in
91+
layer?.featureReduction?.isEnabled = isEnabled
92+
}
93+
}
94+
}
95+
.task {
96+
do {
97+
try await map.load()
98+
await proxy.setViewpointScale(1e7)
99+
layer?.featureReduction?.isEnabled = true
100+
} catch {
101+
self.error = error
102+
}
103+
}
104+
.alert(isPresented: $isShowingAlert, presentingError: error)
105+
}
106+
}
107+
}
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# Display points using clustering feature reduction
2+
3+
Display a web map with a point feature layer that has feature reduction enabled to aggregate points into clusters.
4+
5+
![Image of display points using clustering feature reduction sample](display-points-using-clustering-feature-reduction.png)
6+
7+
## Use case
8+
9+
Feature clustering can be used to dynamically aggregate groups of points that are within proximity of each other in order to represent each group with a single symbol. Such grouping allows you to see patterns in the data that are difficult to visualize when a layer contains hundreds or thousands of points that overlap and cover each other.
10+
11+
## How to use the sample
12+
13+
Pan and zoom the map to view how clustering is dynamically updated. Toggle clustering off to view the original point features that make up the clustered elements. When clustering is toggled on, you can tap on a clustered geoelement to view aggregated information and summary statistics for that cluster. When clustering is toggled off and you tap on the original feature you get access to information about individual power plant features.
14+
15+
## How it works
16+
17+
1. Create a map from a web map `PortalItem`.
18+
2. Get the cluster enabled layer from the map's operational layers.
19+
3. Get the `FeatureReduction` from the feature layer and set `isEnabled` to enable or disable clustering on the feature layer.
20+
4. Use the `onSingleTapGesture` modifier to listen for tap events on the map view.
21+
5. Identify tapped features on the map using `identify(on:screenPoint:tolerance:returnPopupsOnly:maximumResults:)` on the feature layer and pass in the map screen point location.
22+
6. Get the `Popup` from the resulting `IdentifyLayerResult` and use it to construct a `PopupView`.
23+
7. Use a `FloatingPanel` to display the popup information from the `PopupView`.
24+
25+
## Relevant API
26+
27+
* AggregateGeoElement
28+
* FeatureLayer
29+
* FeatureReduction
30+
* GeoElement
31+
* IdentifyLayerResult
32+
33+
## About the data
34+
35+
This sample uses a [web map](https://www.arcgis.com/home/item.html?id=8916d50c44c746c1aafae001552bad23) that displays the [Esri Global Power Plants](https://www.arcgis.com/home/item.html?id=eb54b44c65b846cca12914b87b315169) feature layer with feature reduction enabled. When enabled, the cluster's symbology shows the color of the most common power plant type, and a size relative to the average plant capacity of the cluster.
36+
37+
## Tags
38+
39+
aggregate, bin, cluster, group, merge, normalize, reduce, summarize
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"category": "Visualization",
3+
"description": "Display a web map with a point feature layer that has feature reduction enabled to aggregate points into clusters.",
4+
"ignore": false,
5+
"images": [
6+
"display-points-using-clustering-feature-reduction.png"
7+
],
8+
"keywords": [
9+
"aggregate",
10+
"bin",
11+
"cluster",
12+
"group",
13+
"merge",
14+
"normalize",
15+
"reduce",
16+
"summarize",
17+
"AggregateGeoElement",
18+
"FeatureLayer",
19+
"FeatureReduction",
20+
"GeoElement",
21+
"IdentifyLayerResult"
22+
],
23+
"redirect_from": [],
24+
"relevant_apis": [
25+
"AggregateGeoElement",
26+
"FeatureLayer",
27+
"FeatureReduction",
28+
"GeoElement",
29+
"IdentifyLayerResult"
30+
],
31+
"snippets": [
32+
"DisplayPointsUsingClusteringFeatureReductionView.swift"
33+
],
34+
"title": "Display points using clustering feature reduction"
35+
}
138 KB
Loading

0 commit comments

Comments
 (0)