Figar Ali Posted August 29, 2021 Share Posted August 29, 2021 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? Thanks See the Pen pWyezW by ThiemelJiri (@ThiemelJiri) on CodePen Link to comment Share on other sites More sharing options...
Carl Posted August 29, 2021 Share Posted August 29, 2021 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() 5 Link to comment Share on other sites More sharing options...
Solution GreenSock Posted August 30, 2021 Solution Share Posted August 30, 2021 Yep, in GSAP 3 it's even easier, as @Carl explains beautifully in the video: // OLD Sine.easeInOut.getRatio(diff) // 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! 4 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now