Map rotation

View inAndroidFormsUWPWPFWinUIiOSView on GitHub

Rotate a map.

Image of map rotation

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

  1. Instantiate an Map object.
  2. Set the map in the MapView object.
  3. Use SetViewpointRotationAsync to indicate the rotation angle.

Relevant API

  • Compass
  • Map
  • MapView

Tags

rotate, rotation, viewpoint

Sample Code

MapRotation.xamlMapRotation.xamlMapRotation.xaml.cs
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
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="ArcGISRuntime.Samples.MapRotation.MapRotation"
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:esriUI="clr-namespace:Esri.ArcGISRuntime.Xamarin.Forms;assembly=Esri.ArcGISRuntime.Xamarin.Forms"
             xmlns:sampleViewer="clr-namespace:Forms.Resources;assembly=ArcGISRuntime">
    <RelativeLayout>
        <esriUI:MapView x:Name="MyMapView"
                        BindingContext="{x:Reference Name=ResponsiveFormContainer}"
                        Style="{StaticResource MapWithFormStyle}" />
        <sampleViewer:ResponsiveFormContainer x:Name="ResponsiveFormContainer">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="50" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Slider x:Name="MySlider"
                        Grid.Column="1"
                        Maximum="180"
                        MaximumTrackColor="CadetBlue"
                        Minimum="0"
                        MinimumTrackColor="CadetBlue"
                        ValueChanged="MySlider_ValueChanged"
                        VerticalOptions="CenterAndExpand"
                        Value="0" />
                <Label x:Name="MyLabel"
                       Grid.Column="0"
                       Style="{StaticResource LabelStyle}"
                       Text="0°"
                       VerticalTextAlignment="Center" />
            </Grid>
        </sampleViewer:ResponsiveFormContainer>
    </RelativeLayout>
</ContentPage>

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