Animation

21 Apr 20171 minute to read

Sunburst chart allows you to animate the chart segments. You can enable animation using enable-animation property.

  • CSHTML
    • <ej-sunburstchart id="SunburstChart" enable-animation="true">
</ej-sunburstchart>

    Animation Types

    Sunburst chart provide options to animate the chart segments in different ways using animation-type property.
    FadeIn – It gradually changes opacity of the chart segment.
    Rotation – During an animation, control rotate from 0 to 360 angle.

    Fade In

    The Fade In animation is enabled as follows

  • CSHTML
    • <ej-sunburstchart id="SunburstChart" enable-animation="true" animation-type="@SunburstAnimationType.FadeIn" >
</ej-sunburstchart>

    Rotation

    The following example shows how to enable rotation animation in ejSunburstChart

  • CSHTML
    • <ej-sunburstchart id="SunburstChart" enable-animation="true"  animation-type="@SunburstAnimationType.Rotation" >
</ej-sunburstchart