This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Jordan Robert Dobson
Posted Mar 06 - Read on Facebook

Can someone explain how the tolerance option works on the spring-rk4 curves?

On the docs page for Spring-RK4 it says this for tolerance: "Minimal movement threshold before we say the spring finished".

I took this to mean that the animation will report it is done much sooner than it typically would. My issue is in getting my Event to fire on some spring curve animations. They Events fire about a half second after they appear to be finished. I figured tolerance might help here but it doesn't seem to.

So what does tolerance actually do? and how might it resolve this timing problem elegantly if I change the animation?

Basically my issue is I don't want other hit detection methods to be called until the animation is complete as they were starting from underneath the touch point, thus triggering immediately. :(

Thanks for the help in advance.

10 Comments

Joshua Tucker

+1 on this. I have been diving into the calculus to understand this better but I am still struggling myself.

Koen Bok

Fun question. As the spring is real physics, it never finishes in theory. The bounce will only eventually become invisible because it will result in motion that is less than a pixel.

So to reach an end state, we check if the velocity and movement delta get under a certain threshold. This number is the tolerance.

You can check the code in the rk4 animator class in the finished function.

Jordan Robert Dobson

Right... Never finishes. I figured as much but it wasn't clear where I needed to be, numerically speaking, I had planned on looking at this more tomorrow but I figured I'd see if I could anyone could give me a little more background.

I'm typically used to doing this by hand or individual keyframes, so it's a bit of a new area for me.

I'm glad I understand the pieces, I just figured I might have an answer in the docs on the values but forgot to check github. DUH!

Thanks for pointing me in the right direction. I'll follow up here for future reference. :)

Koen Bok

I think this is your missing piece:

The Animator emits a value between 0 and 1. So if you animate 500px that means 1/500=0.002 represents 1 pixel in movement. So if you set the tolerance to 0.002 it will consider the animation finished if there is < pixel movement in the last animation step.

Jordan Robert Dobson

That's exactly the part I'm missing. You should add that in the docs or at least link to this explanation. :)

Thanks so much!

Jay Stakelon

I totally get this in theory. Then I put together this example where I run the same animation with a few different tolerance values (last row) and they all seem to behave exactly the same. I know that I'm missing something... any thoughts on what it is? http://share.framerjs.com/h1oxf1c4zkcv/

Koen Bok

Let me look what's going on...

Jordan Robert Dobson

Jay - I'm jumping into this myself in a few moments. But the results you are getting are almost exactly what I was seeing... the ~half second delay before it says it's "complete".

Koen Bok

Ok, you guys found a bug. I never set the tolerance:
https://github.com/koenbok/Framer/blob/master/framer/Animation.coffee#L251 I'll fix it tomorrow :-)

Jay Stakelon

Not if I don't get there first ;) https://github.com/koenbok/Framer/pull/179

Read the entire post on Facebook