GSAP usable for clickable animations?

[SirAnn]

Hello there

I'm totally new in svg animations. Thus please don't be too hard to me But still be honest...

 

Too make long stories short:

Right know we are using the GlgToolKit to perform animations, but we want to have a HTML-Solution. We have to visualize a facility composed of some baths (that can be filled), pipes (that can change colors to visualize that a fluid is inside), pumps (that changes color if turned on/of) and some screws (that may rotate). Besides there are a lot of controls that shows some numerical continuous changing values. Thus also it sounds very simple it's more or less complex to trigger and catch all the events.

 

Do you think GSAP or any other svg animation framework is the right approach for that kind of problem? As I can see the default animations starts automatically or may triggered by a mouse click. But in our case the animation will be endless and on defined from outside or mouse click events the animation has to change.

 

For a better understanding you'llfind one of our actual screens made with glg ...

 

Thanks for any idea,

SirAnn

[PointC]

Hi SirAnn 

 

Welcome to the GreenSock forum.

 

If I'm understanding your question and the desired result correctly, then yes - GSAP could handle that animation with no difficulty at all. I have no familiarity with GlgToolKit, but creating your layout as an SVG should be no problem. The diagram looks fairly straight-forward. You have to remember GSAP isn't doing any of the rendering. It simply animates values. The browsers do all the rendering. 

 

Since you want some animations to repeat forever and others to only happen on a click event, I'd think GSAP and its strong ability to sequence timelines would suit your needs quite well.

 

Your diagram reminded me of one of Sarah Drasner's CodePens. Her Huggy Laser Panda Factory shows a terrific example of some infinitely repeating animations along with some interactive tweens. You can see that here:

 

See the Pen waXKPw by sdras (@sdras) on CodePen

 

Hopefully that answers your questions. I'd encourage you to download GSAP and take it for a spin. I think you'll love it.

 

Happy tweening.

[SirAnn]

Thanks a lot... that seems to be what I'm looking for.