silid

Set framerate on timeline

Recommended Posts

If I create a new Timeline set to use frames for timing eg.

var tl = new TimelineMax({ useFrames: true });

 

How do I set the frame rate of the timeline?

 

The only example I can find is for setting the frame rate is for a tween, rather than a timeline, and the ticker property doesn't exist for a timeline.

 

TweenLite.ticker.fps(60);

 

I am migrating some flash animations to JS and I need a frame rate of 50.

 

is it possible to set a frame rate for the whole timeline?

 

Thanks.

Share this post


Link to post
Share on other sites

Hi @silid

 

You can't set the frame rate for a timeline, just for a ticker. There is a way you could manually update a timeline at 50fps, but that requires some work. Can you make a demo of what you're trying to do? There might be a better way to do the conversion. 

  • Like 1

Share this post


Link to post
Share on other sites

Thanks for the reply.

 

I'm making animation for broadcast and work in 50 fields per second. So it isn't a particular animation I want help with, I just want to be able to count in frames at a rate of 50 fps. 

 

When using flash I set the frame rate of the stage and that was fine. I'm looking for the equivalent as I migrate.

 

I presume that when I set the timeline to useFrames it is using 60fps?

So if I set timeScale(0.833333) I will get 50 fps approx?

 

It seems the easiest way is for me to alter the Ticker class to make 50 the default value. But ideally fps would exist as a variable that is passed from the tween to its ticker and from a timeline to a tween to a ticker.

Share this post


Link to post
Share on other sites
1 minute ago, silid said:

Thanks for the reply.

 

I'm making animation for broadcast and work in 50 fields per second. So it isn't a particular animation I want help with, I just want to be able to count in frames at a rate of 50 fps. 

 

50fps seems like a weird number, like with old analog signals and PAL. Are you in Europe?

 

8 minutes ago, silid said:

I presume that when I set the timeline to useFrames it is using 60fps?

So if I set timeScale(0.833333) I will get 50 fps approx?

 

To be honest, I have never dealt with using frames, nor have I seen any questions on this forum (html5/js) about using frames, so that is something that @GreenSock or @Carl would probably have to answer.

 

So I'm not 100% sure about the update frequency, but if you set the timeScale like that, then the playback speed will be probably be more like 50fps. If that's what you're going after, then setting the globalTimeScale might be a better option.

 

 

  • Thanks 1

Share this post


Link to post
Share on other sites
TweenLite.ticker.fps(60);

 

Isn't just for tweens its for the global ticker which controls the refresh rate for everything (tweens and timelines)

TweenLite.ticker is basically the "heartbeat" of the entire engine. Everything is synchronized with those ticks and will refresh at the given fps.

Set it to 50 and you are good to go.

 

  • Like 3
  • Thanks 1

Share this post


Link to post
Share on other sites

Thanks. Yes I am in Europe. 

 

Perfect @Carl I had thought it was attached to an instance. I hadn't realised it applied globally.

Share this post


Link to post
Share on other sites
29 minutes ago, Carl said:

TweenLite.ticker.fps(60);

 

Isn't just for tweens its for the global ticker which controls the refresh rate for everything (tweens and timelines)

TweenLite.ticker is basically the "heartbeat" of the entire engine. Everything is synchronized with those ticks and will refresh at the given fps.

Set it to 50 and you are good to go.

 

 

I was kind of curious about frames because I've never dealt with that.

 

My concern with setting the fps to 50 is that 50 is a very hard number to hit using requestAnimationFrame. So I'm wondering if it might be better to also set useRAF to false?

 

TweenLite.ticker.useRAF(false)
TweenLite.ticker.fps(50)

 

Share this post


Link to post
Share on other sites

I'm not sure that'd help, Blake, because typically screens run at 60hz anyway, so even if setTimeout() was used it's not really gonna look much different. 

 

Frankly, my plan is to remove support for useFrames in GSAP 2.0.0 because it's so infrequently used and I don't think it merits the kb. So it'll always be in 1.x, but I would encourage folks not to start depending on it too much for future versions. Like I said, almost nobody uses it (from what I can tell). If I hear from a lot of people that they need/want it, I'll certainly reconsider. 

  • Like 3

Share this post


Link to post
Share on other sites
17 minutes ago, GreenSock said:

I'm not sure that'd help, Blake, because typically screens run at 60hz anyway, so even if setTimeout() was used it's not really gonna look much different. 

 

Good to know. I wasn't sure about that because I know the time difference between updates could vary a lot more with rAF.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.