Jump to content

Figar Ali

Uncaught TypeError: Sine.easeInOut.getRatio is not a function

Go to solution Solved by GreenSock,

Recommended Posts

I want to use this parametric waves animation with gsap.min library, currently this is working with TwinMAX. After removing the gsap.min It's working fine but I cant remove gsap.min because other animations or not working without gsap.min


I have getting the following error in console.

Uncaught TypeError: Sine.easeInOut.getRatio is not a function



Anyone can help please?



See the Pen pWyezW by ThiemelJiri (@ThiemelJiri) on CodePen

Link to comment
Share on other sites

That’s a really cool effect. 

it looks like you are using a super old version of GSAP though. In GSAP 3 eases are functions as explained in the video below. No more getRatio()




  • Like 5
Link to comment
Share on other sites

  • Solution

Yep, in GSAP 3 it's even easier, as @Carl explains beautifully in the video:

// OLD

// NEW
var sine = gsap.parseEase("sine.inOut"); // this returns an ease function
sine(diff); // now you can use it as many times as you want.


Here's a fork that's updated to GSAP 3:

See the Pen VwWvoxV?editors=0010 by GreenSock (@GreenSock) on CodePen


Notice there's no more BezierPlugin because MotionPathPlugin makes things much easier and more intuitive. 

// OLD
var data = BezierPlugin.bezierThrough(values, curviness);
var d = "M" + data.x[0].a + "," + data.y[0].a + " C" + segmentToString(data.x[0], data.y[0]);
for (var i = 1; i < data.x.length; i++) {
  d += "," + segmentToString(data.x[i], data.y[i]);

// NEW
var data = MotionPathPlugin.rawPathToString(MotionPathPlugin.arrayToRawPath(values, {curviness: 0.5}));

Happy tweening!

  • Like 4
  • Thanks 1
Link to comment
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.