[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Collapse]Charts Suite
   [Collapse]Chart Control
    [Expand]Getting Started
    [Expand]Fundamentals
    [Expand]Providing Data
    [Expand]Chart Elements
    [Expand]Appearance Customization
    [Collapse]End-User Features
     [Expand]End-User Capabilities
     [Expand]Tooltip and Crosshair Cursor
      Tooltips
      Hit-Testing
      Selection
     [Collapse]Animation
       Animating Series
       Animating Series Points
       Animating 3D Diagram
       Animating Series Indicators
      Print and Export
      Chart Designer for End-Users
    [Expand]Design-Time Features
    [Expand]Examples
    [Expand]Additional Resources
   [Expand]Chart3D Control
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Animating Series

This topic provides information on how to animate Series for both 2D and 3D chart types.

Expanded 2D Animated Charts

In the 2D chart types, there are two approaches to providing an animation effect for the series:

  • all series can be animated simultaneously using the built-in animation effect;
  • the animation effect can be specified for each series individually.

To animate all series and/or Series Points within a chart using the built-in animation effect (depends on a given series type), specify the chart animation mode using the ChartControl.AnimationMode property.

Note

To obtain the list of all animations that are available for a given series, use the Series.GetPredefinedSeriesAnimationKinds and Series.GetPredefinedPointAnimationKinds methods.

To animate a specific series using a custom effect, assign an animation to its SeriesAnimation property (e.g., AreaSeries2D.SeriesAnimation).

The following is a list of animation effects that are available for the AreaSeries2D view type:

The image below shows the Area2DUnwindAnimation effect in action.

Example

For a real-world example on how to animate a chart series, see the following tutorial.

To customize the animation effect, you can use the following properties.

Member Description
Series.AnimationAutoStartMode Specifies the automatic start mode for the Animation. This is a dependency property.
AnimationBase.BeginTime Specifies the time when the Animation is started. This is a dependency property.
AnimationBase.Duration Specifies the duration of the Animation. This is a dependency property.
AnimationBase.EasingFunction Specifies the easing function for the Animation. This is a dependency property.

Expanded 3D Animated Charts

To animate a series of the 3D chart type, add a trigger to a series Triggers collection, which will start the series animation in response to the chart's Loaded event.

The following image shows the BarSideBySideSeries3D chart type animation.

Example

For a real-world example on how this can be done, see the following tutorial.

Expanded See Also

Is this topic helpful?​​​​​​​