Overview Map

Download Samples Repository

Description

This sample demonstrates displaying an overview map to indicate the extent of the parent map.

"Desktop" "Store" "Phone" Available for Desktop, Store, Phone

Sample Code

<UserControl x:Class="ArcGISRuntime.Samples.Desktop.OverviewMap"
			 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
			 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
			 xmlns:esri="http://schemas.esri.com/arcgis/runtime/2013">
	<Grid x:Name="layoutGrid">
		<esri:MapView x:Name="MyMapView">
			<esri:Map InitialViewpoint="-5, 20, 50, 65, 4326">
				<esri:ArcGISTiledMapServiceLayer ID="Basemap"
					ServiceUri="http://services.arcgisonline.com/ArcGIS/rest/services/NatGeo_World_Map/MapServer" />
			</esri:Map>
		</esri:MapView>
		
		<Border Background="White" BorderBrush="Black" BorderThickness="1"
				HorizontalAlignment="Right" VerticalAlignment="Top"
				Margin="30" Padding="20">
			<Border.Effect>
				<DropShadowEffect/>
			</Border.Effect>
			<esri:MapView x:Name="overviewMap" Width="300" Height="200">
				<esri:MapView.InteractionOptions>
					<esri:InteractionOptions IsEnabled="False"/>
				</esri:MapView.InteractionOptions>
				<esri:Map>
					<esri:ArcGISTiledMapServiceLayer
						ServiceUri="http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer" />
				</esri:Map>
				<esri:MapView.GraphicsOverlays>
					<esri:GraphicsOverlay ID="overviewOverlay">
						<esri:GraphicsOverlay.Renderer>
							<esri:SimpleRenderer>
								<esri:SimpleFillSymbol Color="#22FF0000">
									<esri:SimpleFillSymbol.Outline>
										<esri:SimpleLineSymbol Color="Red" Width="2" />
									</esri:SimpleFillSymbol.Outline>
								</esri:SimpleFillSymbol>
							</esri:SimpleRenderer>
						</esri:GraphicsOverlay.Renderer>
					</esri:GraphicsOverlay>
				</esri:MapView.GraphicsOverlays>
			</esri:MapView>
		</Border>
	</Grid>
</UserControl>
using Esri.ArcGISRuntime.Layers;
using Esri.ArcGISRuntime.Controls;
using System.Linq;
using System.Windows.Controls;

namespace ArcGISRuntime.Samples.Desktop
{
	/// <summary>
	/// This sample demonstrates displaying an overview map to indicate the extent of the parent map.
	/// </summary>
	/// <title>Overview Map</title>
	/// <category>Mapping</category>
	public partial class OverviewMap : UserControl
	{
		/// <summary>Construct Overview Map sample control</summary>
		public OverviewMap()
		{
			InitializeComponent();
			MyMapView.ExtentChanged += MyMapView_ExtentChanged;
		}

		private async void MyMapView_ExtentChanged(object sender, System.EventArgs e)
		{
			var graphicsOverlay = overviewMap.GraphicsOverlays["overviewOverlay"];

			// Update overview map graphic
			Graphic g = graphicsOverlay.Graphics.FirstOrDefault();
			if (g == null) //first time
			{
				g = new Graphic();
				graphicsOverlay.Graphics.Add(g);
			}
            // Get current viewpoints extent from the MapView
            var currentViewpoint = MyMapView.GetCurrentViewpoint(ViewpointType.BoundingGeometry);
            var viewpointExtent = currentViewpoint.TargetGeometry.Extent;
			g.Geometry = viewpointExtent;

			// Adjust overview map scale
			await overviewMap.SetViewAsync(viewpointExtent.GetCenter(), MyMapView.Scale * 15);
		}
	}
}
Feedback on this topic?