Slider and Animation Triggers

Oct 04, 2016

Austin McKenzie
By Austin McKenzie

Hi

I am trying to create and interactive bar chart with a slider control.

I want the bar chart to animate as a user moves the slider to various points.

So here is my example:

If I have a slider with 5 points, there will be 5 bars for each point. If you drag the slider to point 2 I want the bar to animate in, if you then move the slider to point 3, I would like bar 3 to animation in but for bar 2 to animate out. 

In summary whichever ever point you move to I want the animation to come in and whichever point you came from to animate out again. I can make it work with 2 points but if you start adding more then it seems to break down my animation. For example when you move to point 2 from 3 then I would like bar2 to animation in and bar 3 to animate out (which I can do) but bar 1 also animates out, as this is programmed earlier. This is confusing, haha.

I have added the file I have at the moment.

 

N.B I have added an additional file to show what I have working. The last thing I need to do is make only the bar you have moved from animate down rather than them all.

 

Thanks

4 Replies
Walt Hamilton
over 7 years ago10/04/16 at 1:40 pm (UTC)

You have a good start. Here is one way to finish. As the very last of the "when slider moves" triggers, "Adjust variable OldPosition = Slider"  Then add a condition to the other triggers to adjust the rectangles. For example: Rectangle 1 animates out when the slider moves to position 2 ONLY if the OldPosition = 1. That way Rectangle 1 doesn't animate when the slider moves from 3 to 2, only when it moves from 1 to 2.

This discussion is closed. You can start a new discussion or contact Articulate Support.