Edit the values of a KML ground overlay.
Use case
KML ground overlays are used for showing aerial imagery, symbology, or other images draped over a scene. Changing the geometry, rotation, and other attributes of a ground overlay after it has been loaded allows for live editing. For example, editing the geometry and opacity of a historical image draped over present day satellite imagery makes it possible to view change over time.
How to use the sample
Use the slider to adjust the opacity of the ground overlay.
How it works
- Create an
Envelopedefining the geometry of the overlay. - Create a
KMLIconusing aURLlinking to an image. - Create a
KMLGroundOverlayusing the envelope and icon. - Set the value of
KMLGroundOverlay.rotation. - Create a
KMLDatasetusing the ground overlay. - Create a
KMLLayerusing the dataset. - Add the KML layer to the scene.
- Listen for changes to the opacity slider and change the
KMLGroundOverlay.colorvalue appropriately.
Relevant API
- KMLDataset
- KMLGroundOverlay
- KMLIcon
- KMLLayer
About the data
The image used in this sample is an aerial view of the campus of the University of Oregon. This imagery was taken in 1944 by the U.S. Army Corps of Engineers. It is publicly available as Online Aerial Imagery hosted by Oregon University Library. It is also available as a Portal item on ArcGIS Online as University of Oregon Campus Aerial Imagery - 1944.
Tags
imagery, Keyhole, KML, KMZ, OGC
Sample Code
// 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
//
// https://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 ArcGIS
import SwiftUI
struct SetKMLGroundOverlayPropertiesView: View {
/// A scene with an imagery basemap.
@State private var scene = Scene(basemapStyle: .arcGISImagery)
/// A KML ground overlay for making a KML dataset.
@State private var overlay: KMLGroundOverlay = {
// Create a geometry for the ground overlay.
let overlayGeometry = Envelope(xMin: -123.066227926904, yMin: 44.04736963555683, xMax: -123.0796942287304, yMax: 44.03878298600624, spatialReference: .wgs84)
// Create a KML icon for the overlay image.
let imageURL = URL(string: "https://libapps.s3.amazonaws.com/accounts/55937/images/1944.jpg")!
let overlayImage = KMLIcon(url: imageURL)
let overlay = KMLGroundOverlay(geometry: overlayGeometry, icon: overlayImage)!
// Set the rotation of the ground overlay.
overlay.rotation = -3.046024799346924
return overlay
}()
/// The current viewpoint of the scene view.
@State private var viewpoint: Viewpoint?
/// The opacity slider value.
@State private var opacity: CGFloat = 1
var body: some View {
SceneView(scene: scene, viewpoint: viewpoint)
.task {
// Create a KML dataset with the ground overlay as the root node.
let dataset = KMLDataset(rootNode: overlay)
// Create a KML layer for the scene view.
let layer = KMLLayer(dataset: dataset)
// Add the layer to the scene.
scene.addOperationalLayer(layer)
// Move the viewpoint to the ground overlay.
if let targetExtent = overlay.extent {
let camera = Camera(lookingAt: targetExtent.center, distance: 1250, heading: 45, pitch: 60, roll: 0)
viewpoint = Viewpoint(boundingGeometry: targetExtent, camera: camera)
}
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
HStack {
Slider(value: $opacity, in: 0.0...1.0, step: 0.01)
.onChange(of: opacity) {
// Change the color of the overlay according to the slider's value.
overlay.color = .black.withAlphaComponent(opacity)
}
VStack {
Text("Opacity")
Text(opacity, format: .percent.precision(.fractionLength(0)))
}
}
}
}
}
}
#Preview {
SetKMLGroundOverlayPropertiesView()
}