• Material 3
  • Fluent
  • Fluent 2
  • Bootstrap 5
  • Tailwind CSS
  • High Contrast
  • Fluent 2 High Contrast
Preferences
Mode Selection
Touch
Mouse
Theme Selection
Theme Mode
Localization
*Translated by Google Translator.
Currency

Example of Custom Animation in ASP.NET Core Chart Control

This sample visualizes the almond yield per hectare data for different countries using a spline series in the chart. The data points are enhanced with tooltip and the animation delay is configured to provide a smooth, staggered effect.

DEMO
SOURCE

In this example, you can see how to render and configure a spline chart with multiple series representing almond yield across different countries over time. Spline charts are ideal for visualizing smooth trends in data over equal intervals, particularly time-dependent data. The Width and Animation properties are used to customize the appearance and behavior of the spline. The staggered animations enhance the visual experience by introducing each spline in sequence.

Tooltip is enabled in this example, to see the tooltip in action, hover a point or tap on a point in touch enabled devices.

More information on the spline series can be found in this documentation sectionopens in a new tab.

Transform your ASP.NET Core web apps today with Syncfusion® ASP.NET Core components
85+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE
opens in a new tab