Animate 3D Graphic

This sample demonstrates how to animate a graphic's position and follow it using a camera controller.

Animate 3d graphic in a scene view


Click-and-drag to pan the SceneView, orbiting the moving plane. Click "Don't Follow" to switch to the default camera controller, which does not orbit the plane. The plane's route is shown on the inset map in the bottom left corner of the window. The progress through the plane's mission is shown in a slider at the top of the window. Drag the slider to seek through the mission (like you might seek through a song). The play speed can be adjusted to either be slower or faster using the slider in the panel on the right. There is a drop-down box on the top left part of the window for selecting a mission (route) for the plane. Note that this is a graphics-intensive sample; performance may be degraded in certain situations (such as viewing over Remote Desktop).


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns=""
             Title="Animate 3D Graphic">
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="170" />
            <ColumnDefinition Width="170" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="150" />
        <esriUI:SceneView x:Name="MySceneView" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" Grid.RowSpan="3" AtmosphereEffect="Realistic" />
        <StackLayout Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" Orientation="Horizontal" Margin="5">
            <Picker x:Name="MissionSelectionBox" />
            <Button Clicked="MissionPlayPlauseClick" Margin="5,0,0,0" Text="Pause" />
            <Button  HorizontalOptions="End" VerticalOptions="End" Clicked="ToggleFollowPlane" Text="Don't Follow" />
        <Frame Grid.Row ="1" Grid.Column="2" Margin="5"  x:Name="LayoutFrame">
            <!-- Frame is hidden on iOS due to layout issues -->
            <StackLayout Padding="5" Opacity=".7" BackgroundColor="White">
                <Label TextColor="Black" Text="Mission Progress:" />
                <Slider x:Name="MissionProgressBar" Maximum="100" ValueChanged="MissionProgressOnSeek" />
                <Label TextColor="Black" >Altitude:</Label>
                <Label TextColor="Black" x:Name="AltitudeLabel" />
                <Label TextColor="Black">Heading:</Label>
                <Label TextColor="Black" x:Name="HeadingLabel" />
                <Label TextColor="Black">Pitch:</Label>
                <Label TextColor="Black" x:Name="PitchLabel" />
                <Label TextColor="Black">Roll:</Label>
                <Label TextColor="Black" x:Name="RollLabel" />
        <esriUI:MapView x:Name="InsetMapView" Grid.Row="2"  Grid.Column="0" Margin="20" IsAttributionTextVisible="False" />

In this topic
  1. Instructions
  2. Code