Map rotation
Rotate a map.
Use case
A user may wish to view the map in an orientation other than north-facing.
How to use the sample
Use the slider to rotate the map.
How it works
- Instantiate an
Map
object. - Set the map in the
MapView
object. - Use
SetViewpointRotationAsync
to indicate the rotation angle.
Relevant API
- Map
- Compass
- MapView
Tags
rotate, rotation, viewpoint
Sample Code
<UserControl
x:Class="ArcGISRuntime.UWP.Samples.MapRotation.MapRotation"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:esriUI="using:Esri.ArcGISRuntime.UI.Controls">
<Grid>
<esriUI:MapView x:Name="MyMapView" />
<Border BorderBrush="Black" BorderThickness="1" Background="White"
HorizontalAlignment="Right" VerticalAlignment="Top"
Margin="30" Padding="20" Width="375">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<Slider x:Name="MySlider"
Grid.Column="0"
Minimum="0" Maximum="180" Value="0"
ValueChanged="MySlider_ValueChanged" />
<TextBlock x:Name="MyTextBlock"
Text="0°"
Margin="5,8,0,0"
TextAlignment="Center" FontWeight="SemiBold"
Grid.Column="1" />
</Grid>
</Border>
</Grid>
</UserControl>
// Copyright 2018 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.
using Esri.ArcGISRuntime.Mapping;
using Windows.UI.Xaml.Controls.Primitives;
namespace ArcGISRuntime.UWP.Samples.MapRotation
{
[ArcGISRuntime.Samples.Shared.Attributes.Sample(
name: "Map rotation",
category: "MapView",
description: "Rotate a map.",
instructions: "Use the slider to rotate the map.",
tags: new[] { "rotate", "rotation", "viewpoint" })]
public partial class MapRotation
{
public MapRotation()
{
InitializeComponent();
Initialize();
}
private void Initialize()
{
// Assign the map to the MapView
MyMapView.Map = new Map(Basemap.CreateStreets());
}
private void MySlider_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
{
// Display the rotation value in the Label formatted nicely with degree symbol.
MyTextBlock.Text = $"{MySlider.Value:0}°";
// Set the MapView rotation to that of the Slider.
MyMapView.SetViewpointRotationAsync(e.NewValue);
}
}
}