Search code examples
javascriptanimationamcharts

AmCharts line chart animation

Is it possible to animate a line chart in AmCharts in a way that shows the line being drawn (either by connecting the bullets or drawing the line sequentially left to right)?

I've played around with the startDuration, startEffect and sequencedAnimation properties but all of the options seem to animate the entire line as a whole, either sliding it down from the top or bouncing it upon entry. It's better than no animation and is perfect for column/bar graphs but it looks somewhat odd and unnatural for a line graph.

Here is the relevant documentation for AmCharts.

Solution

  • As stated in the documentation you linked to, http://docs.amcharts.com/3/javascriptcharts/AmSerialChart#startEffect, the only effects that are available at this point in time are...

    • easeOutSine
    • easeInSine
    • elastic
    • bounce

    These are all bounce or slide in type graphs, they do not currently offer a join the dots type effect that you are wanting as yet.